<template>
  <div class="general-view">
    <el-row :class="[isFullscreen ? 'screen' : 'screen screenStyle' ]">
      <el-col :span="24" class="mb15 card-flex">
        <div v-loading="loading" class="list-table noImg pt15" style="flex:1;">
          <!--          &lt;!&ndash; 正常 &ndash;&gt;-->
          <span class="pointer" @click="onFullscreen(false)"><svg-icon v-if="isFullscreen" icon-class="fullscreen" /></span>
          <!--          &lt;!&ndash; 全屏 &ndash;&gt;-->
          <span class="pointer" @click="onFullscreen(true)"><svg-icon v-if="!isFullscreen" icon-class="exit-fullscreen" /></span>
          <el-row v-if="investInfoData" class="investDetail" :gutter="20">
            <el-col v-if="investInfoData.dealInfo" class="" :span="8">
              <span class="label">{{ $t('团队成员') }}：</span>
              <span class="link-hover-click">
                <div class="tagInvest">
                  <el-tag v-for="tag in investInfoData.dealInfo.team" v-show="tag.user.nickName" :key="tag.id" size="small" effect="plain">{{ tag.user.nickName }}</el-tag>
                  <el-tag v-if="!investInfoData.dealInfo.team || investInfoData.dealInfo.team.length === 0" size="small" effect="plain" style="border: none !important">&nbsp;</el-tag>
                </div>
              </span>
            </el-col>
            <el-col v-if="investInfoData.dealInfo" class="" :span="16">
              <span class="label">{{ $t('外派人员') }}：</span>
              <span class="link-hover-click">
                <div class="tagInvest">
                  <el-tag v-for="tag in investInfoData.dealInfo.expats" v-show="tag.user.nickName" :key="tag.id" size="small" effect="plain">{{ tag.user.nickName + (tag.level ? '(' + (selectDictLabel(levelOptions,tag.level)) + ')' : '') }}</el-tag>
                  <el-tag v-if="!investInfoData.dealInfo.expats || investInfoData.dealInfo.expats.length === 0" size="small" effect="plain" style="border: none !important">&nbsp;</el-tag>
                </div>
              </span>
            </el-col>
            <el-col :span="24" class="">
              <span class="label">{{ $t('投资主体') }}：</span>
              <span class="link-hover-click">
                <div class="tagInvest">
                  <el-tag v-for="(item, index) in investList" :key="index" style="cursor: pointer" :type="investVal === item.id ? 'success' : ''" size="small" effect="plain" @click="tagClickHandler(item)">{{ item.name }}</el-tag>
                  <!--                  <el-checkbox-group v-model="investVal" size="mini">-->
                  <!--                    <el-checkbox v-for="v in investList" :key="v" :label="v" border />-->
                  <!--                  </el-checkbox-group>-->
                </div>
              </span>
            </el-col>
            <el-col :span="8">
              <span class="label">{{ $t('IRR') }}：</span>
              <span :title="investInfoData.latestIrr === undefined || investInfoData.latestIrr === null || investInfoData.latestIrr === '' ? '无' : (investInfoData.latestIrr === 0 ? '0' : (investInfoData.latestIrr).toFixed(6))" class="link-hover-click">{{ investInfoData.latestIrr === undefined || investInfoData.latestIrr === null || investInfoData.latestIrr === '' ? '无' : (investInfoData.latestIrr === 0 ? '0' : (investInfoData.latestIrr).toFixed(2)) }}</span>
            </el-col>
            <el-col v-if="investInfoData.dealInfo && investInfoData.dealInfo" :span="8">
              <template v-if="investInfoData.dealInfo.cashflow">
                <span class="label">{{ $t('MOIC') }}：</span>
                <span class="link-hover-click" :title="investInfoData.dealInfo.cashflow.moic === undefined || investInfoData.dealInfo.cashflow.moic === null || investInfoData.dealInfo.cashflow.moic === '' ? '无' : (investInfoData.dealInfo.cashflow.moic === 0 ? '0' : (investInfoData.dealInfo.cashflow.moic).toFixed(6))">{{ investInfoData.dealInfo.cashflow.moic === undefined || investInfoData.dealInfo.cashflow.moic === null || investInfoData.dealInfo.cashflow.moic === '' ? '无' : (investInfoData.dealInfo.cashflow.moic === 0 ? '0' : (investInfoData.dealInfo.cashflow.moic).toFixed(2)) }}</span>
              </template>
              <template v-else>
                <span class="label">{{ $t('MOIC') }}：</span>
                <span class="link-hover-click">&nbsp;</span>
              </template>
            </el-col>
            <el-col v-if="investInfoData.dealInfo && investInfoData.dealInfo" :span="8">
              <template v-if="investInfoData.dealInfo.cashflow">
                <span class="label">{{ $t('DPI') }}：</span>
                <span :title="investInfoData.dealInfo.cashflow.dpi === undefined || investInfoData.dealInfo.cashflow.dpi === null || investInfoData.dealInfo.cashflow.dpi === '' ? '无' : (investInfoData.dealInfo.cashflow.dpi === 0 ? '0' : (investInfoData.dealInfo.cashflow.dpi).toFixed(6))" class="link-hover-click">{{ investInfoData.dealInfo.cashflow.dpi === undefined || investInfoData.dealInfo.cashflow.dpi === null || investInfoData.dealInfo.cashflow.dpi === '' ? '无' : (investInfoData.dealInfo.cashflow.dpi === 0 ? '0' : (investInfoData.dealInfo.cashflow.dpi).toFixed(2)) }}</span>
              </template>
              <template v-else>
                <span class="label">{{ $t('DPI') }}：</span>
                <span class="link-hover-click">&nbsp;</span>
              </template>
            </el-col>
            <!--            <el-col :span="8">-->
            <!--              <span class="label">{{ $t('项目负责人') }}：</span>-->
            <!--              <span class="link-hover-click">{{ investInfoData.nickName === undefined ? '' : investInfoData.nickName }}</span>-->
            <!--            </el-col>-->
            <el-col :span="8">
              <span class="label">{{ $t('投资时间') }}：</span>
              <span class="link-hover-click">{{ investInfoData.dateInvestmentFact === undefined ? '' : investInfoData.dateInvestmentFact }}</span>
            </el-col>
            <el-col :span="8">
              <span class="label">{{ $t('投资金额') }}{{ $t('金额单位') }}：</span>
              <span :title="investInfoData.amountInvestmentEstimate == undefined ? '' : moneyFormat(investInfoData.amountInvestmentEstimate, 'w')" class="link-hover-click">{{ investInfoData.amountInvestmentEstimate == undefined ? '' : moneyFormat(investInfoData.amountInvestmentEstimate, 'w',2,true) }}</span>
            </el-col>
            <el-col v-if="investInfoData.dealInfo && investInfoData.dealInfo.dealBase" :span="8">
              <span class="label">{{ $t('聚焦行业') }}：</span>
              <span class="link-hover-click">{{ investInfoData.dealInfo && investInfoData.dealInfo.dealBase && (investInfoData.dealInfo.dealBase.industryFocus === undefined || investInfoData.dealInfo.dealBase.industryFocus === null || investInfoData.dealInfo.dealBase.industryFocus === '') ? '' : selectDictLabel(focusOptions,investInfoData.dealInfo.dealBase.industryFocus) }}</span>
            </el-col>
            <el-col :span="8">
              <span class="label">{{ $t('最新持股比例(%)') }}：</span>
              <span class="link-hover-click" :title="investInfoData.latestShareholdingRatio === undefined || investInfoData.latestShareholdingRatio === null || investInfoData.latestShareholdingRatio === '' ? '' : (investInfoData.latestShareholdingRatio === 0 ? '' : (investInfoData.latestShareholdingRatio).toFixed(2))">{{ investInfoData.latestShareholdingRatio === undefined || investInfoData.latestShareholdingRatio === null || investInfoData.latestShareholdingRatio === '' ? '' : (investInfoData.latestShareholdingRatio === 0 ? '' : (investInfoData.latestShareholdingRatio).toFixed(2)) }}</span>
            </el-col>
            <el-col v-if="this.$route.query.dealType !== 'estate'" :span="8">
              <span class="label">{{ $t('项目最新估值') }}{{ $t('金额单位') }}：</span>
              <span v-if="this.$route.query.dealType === 'debt'" :title="investInfoData.debtValuationAmount === undefined ? '' : moneyFormat(investInfoData.debtValuationAmount, 'w')" class="link-hover-click">{{ investInfoData.debtValuationAmount === undefined ? '' : moneyFormat(investInfoData.debtValuationAmount, 'w',2,true) }}</span>
              <span v-else class="link-hover-click" :title="investInfoData.valuationAfterInvestment === undefined ? '' : moneyFormat(investInfoData.valuationAfterInvestment, 'w')">{{ investInfoData.valuationAfterInvestment === undefined ? '' : moneyFormat(investInfoData.valuationAfterInvestment, 'w',2,true) }}</span>
            </el-col>
            <!--            <el-col :span="8">-->
            <!--              <span class="label">{{ $t('剩余成本') }}{{ $t('金额单位') }}：</span>-->
            <!--              <span class="link-hover-click">{{ investInfoData.residualCost === undefined ? '' : moneyFormat(investInfoData.residualCost, 'w') }}</span>-->
            <!--            </el-col>-->
            <el-col :span="8">
              <span class="label">{{ $t('累计回款') }}{{ $t('金额单位') }}：</span>
              <span class="link-hover-click" :title="investInfoData.realizedGain === undefined ? '' : moneyFormat(investInfoData.realizedGain, 'w')">{{ investInfoData.realizedGain === undefined ? '' : moneyFormat(investInfoData.realizedGain, 'w',2,true) }}</span>
            </el-col>
            <el-col :span="8">
              <span class="label">{{ $t('币种') }}：</span>
              <span class="link-hover-click">{{ currency }}</span>
            </el-col>
            <!--            <el-col :span="8">-->
            <!--              <span class="label">{{ $t('未实现收益') }}{{ $t('金额单位') }}：</span>-->
            <!--              <span class="link-hover-click">{{ investInfoData.unrealizedGain === undefined ? '' : moneyFormat(investInfoData.unrealizedGain, 'w') }}</span>-->
            <!--            </el-col>-->
            <el-col :span="24">
              <span class="label">{{ $t('项目简介') }}：</span>
              <span class="link-hover-click pre" style="max-height: 230px;overflow: auto">{{ investInfoData.dealIntroduction === undefined ? '' : investInfoData.dealIntroduction }}</span>
            </el-col>
            <el-col v-if="investInfoData.planExit" :span="24" class="mb0">
              <span class="label">{{ $t('退出计划') }}：</span>
              <span class="link-hover-click pre" style="max-height: 230px;overflow: auto">{{ investInfoData.planExit === undefined ? '' : investInfoData.planExit }}</span>
            </el-col>
          </el-row>
        </div>
        <div class="right" style="width: 180px;">
          <div class="list-table pad10 xmfx">
            <div class="head-top">
              <div class="head">
                <h3>项目风险</h3>
                <i class="el-icon-more" @click="openForm(1)" />
              </div>
            </div>
            <div class="xmfx-li">
              <div>
                <span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.gz ? dealDatainfo.dealRisk.gz : 0 }}<i>{{ $t('条') }}</i></span>
                <span>{{ $t('已关注') }}</span>
              </div>
              <div>
                <span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.fs ? dealDatainfo.dealRisk.fs : 0 }}<i>{{ $t('条') }}</i></span>
                <span>{{ $t('已发生') }}</span>
              </div>
              <div>
                <span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.gb ? dealDatainfo.dealRisk.gb : 0 }}<i>{{ $t('条') }}</i></span>
                <span>{{ $t('已关闭') }}</span>
              </div>
            </div>
          </div>
          <div class="list-table pad10 cbjk">
            <div class="head-top">
              <div class="head">
                <h3>{{ $t('财报监控') }}<span>{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.sumCount : 0 }}{{ $t('次') }}</span></h3>
                <i class="el-icon-more" @click="openForm(2)" />
              </div>
            </div>
            <div class="xmfx-li">
              <div>
                <span class="dyestuff">{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.wclCount : 0 }}<i>{{ $t('条') }}</i></span>
                <span>{{ $t('待处理') }}</span>
              </div>
              <div>
                <span class="dyestuff" style="color: #FD9D2C;">{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.yclCount : 0 }}<i>{{ $t('条') }}</i></span>
                <span>{{ $t('已处理') }}</span>
              </div>
            </div>
          </div>
          <div class="list-table pad10 zdsx">
            <div class="head-top">
              <div class="head">
                <h3>{{ $t('重大事项') }}<span>{{ dealDatainfo && dealDatainfo.dealMatter ? dealDatainfo.dealMatter.count : 0 }}{{ $t('次') }}</span></h3>
                <i class="el-icon-more" @click="openForm(3)" />
              </div>
            </div>
            <div class="xmfx-span">
              <div><i>{{ $t('最近发生时间') }}</i>: <span class="dyestuff">{{ dealDatainfo && dealDatainfo.dealMatter ? parseTime(dealDatainfo.dealMatter.happenTime,'{y}-{m}-{d}') : '--' }}</span></div>
              <div><i>{{ $t('事项类型') }}</i>: <span class="dyestuff">{{ dealDatainfo && dealDatainfo.dealMatter ? selectDictLabel(matterOptions,dealDatainfo.dealMatter.type) : '--' }}</span></div>
            </div>
          </div>
        </div>
        <!-- <div style="width: 180px;">
          <div class="list-table pad10 xmfx mb15">
            <div class="head-top">
              <div class="head">
                <span class="icon xmfx-icon" />
                <i class="el-icon-more" @click="openForm(1)" />
              </div>
              <div class="title">
                <h3>项目风险</h3>
              </div>
            </div>
            <div class="xmfx-li">
              <template v-if="dealDatainfo.dealRisk">
                <p>{{ $t('已关注') }}<span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.gz ? dealDatainfo.dealRisk.gz : 0 }}</span>{{ $t('条') }}</p>
                <p>{{ $t('已发生') }}<span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.fs ? dealDatainfo.dealRisk.fs : 0 }}</span>{{ $t('条') }}</p>
                <p>{{ $t('已关闭') }}<span class="dyestuff">{{ dealDatainfo.dealRisk && dealDatainfo.dealRisk.gb ? dealDatainfo.dealRisk.gb : 0 }}</span>{{ $t('条') }}</p>
              </template>
              <template v-else>
                <p>{{ $t('已关注') }}<span class="dyestuff">0</span>{{ $t('条') }}</p>
                <p>{{ $t('已发生') }}<span class="dyestuff">0</span>{{ $t('条') }}</p>
                <p>{{ $t('已关闭') }}<span class="dyestuff">0</span>{{ $t('条') }}</p>
              </template>
            </div>
          </div>
          <div class="list-table pad10 cbjk mb15">
            <div class="head-top">
              <div class="head">
                <span class="icon cbjk-icon" />
                <i class="el-icon-more" @click="openForm(2)" />
              </div>
              <div class="title">
                <h3>{{ $t('财报监控') }}</h3>
                <span>{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.sumCount : 0 }}{{ $t('次') }}</span>
              </div>
            </div>
            <div class="xmfx-li">
              <p>{{ $t('待处理') }}<span class="dyestuff">{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.wclCount : 0 }}</span>{{ $t('条') }}</p>
              <p>{{ $t('已处理') }}<span class="dyestuff">{{ dealDatainfo && dealDatainfo.pcwRisk ? dealDatainfo.pcwRisk.yclCount : 0 }}</span>{{ $t('条') }}</p>
            </div>
          </div>
          <div class="list-table pad10 zdsx">
            <div class="head-top">
              <div class="head">
                <span class="icon zdsx-icon" />
                <i class="el-icon-more" @click="openForm(3)" />
              </div>
              <div class="title">
                <h3>{{ $t('重大事项') }}</h3>
                <span>{{ dealDatainfo && dealDatainfo.dealMatter ? dealDatainfo.dealMatter.count : 0 }}{{ $t('次') }}</span>
              </div>
            </div>
            <div class="xmfx-li">
              <p><span class="dyestuff">{{ dealDatainfo && dealDatainfo.dealMatter ? parseTime(dealDatainfo.dealMatter.happenTime,'{y}-{m}-{d}') : '--' }}</span></p>
              <p><span class="dyestuff">{{ dealDatainfo && dealDatainfo.dealMatter ? selectDictLabel(matterOptions,dealDatainfo.dealMatter.type) : '--' }}</span></p>
            </div>
          </div>
        </div> -->
      </el-col>
      <!--      <el-col :span="24" class="mb15">-->
      <!--        <div class="list-table currentDeal">-->
      <!--          <div class="area-header">-->
      <!--            <span class="area-header-title">-->
      <!--              {{ companyData.companyName }}-->
      <!--              <span class="tag" style="background:#409FFE;">{{ investInfoData.nickName }}</span>-->
      <!--              <span class="tag" style="background:#37CB87;">B轮</span>-->
      <!--              <span class="tag" style="background:#F38826;">投后</span>-->
      <!--            </span>-->
      <!--          </div>-->
      <!--          <el-table tooltip-effect="darkTable" :data="dealInvestmentList" show-summary border>-->
      <!--            <el-table-column label="" fixed type="type" align="center" width="70">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span v-if="scope.row.type === '基金'" class="fund-tag">{{ scope.row.type }}</span>-->
      <!--                <span v-else class="organ-tag">{{ scope.row.type }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('投资主体')" fixed="left" align="center" prop="investorName" min-width="150" show-overflow-tooltip>-->
      <!--              <template slot-scope="scope">-->
      <!--                <span class="link-type">{{ scope.row.investorName }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('币种')" align="center" prop="currency" width="80" />-->
      <!--            <el-table-column :label="$t('协议签署时间')" align="center" prop="investmentSignTime" show-overflow-tooltip width="110">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span>{{ parseTime(scope.row.investmentSignTime) }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('协议金额') + $t('金额单位')" align="center" prop="agreementMoneyInvest" show-overflow-tooltip width="110">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span class="money-text">{{ moneyFormat(scope.row.agreementMoneyInvest, 'w') }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('预计投资时间')" align="center" prop="dateInvestmentEstimate" width="110" show-overflow-tooltip>-->
      <!--              <template slot-scope="scope">-->
      <!--                <span>{{ parseTime(scope.row.dateInvestmentEstimate) }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('累计投资金额') + $t('金额单位')" align="center" prop="amountInvestmentFact" show-overflow-tooltip width="130">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span class="money-text">{{ moneyFormat(scope.row.amountInvestmentFact, 'w') }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('累计汇款本金') + $t('金额单位')" align="center" prop="amountInvestmentEstimate" show-overflow-tooltip width="130">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span class="money-text">{{ moneyFormat(scope.row.amountInvestmentEstimate, 'w') }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('累计回收收益') + $t('金额单位')" align="center" prop="earnings" show-overflow-tooltip width="130">-->
      <!--              <template slot-scope="scope">-->
      <!--                <span class="money-text">{{ moneyFormat(scope.row.earnings, 'w') }}</span>-->
      <!--              </template>-->
      <!--            </el-table-column>-->
      <!--            <el-table-column :label="$t('累计持股比例(%)')" align="center" prop="latestShareholdingRatio" show-overflow-tooltip width="120" />-->

      <!--            <el-table-column :label="$t('最新IRR(%)')" align="center" prop="latestIrr" show-overflow-tooltip width="100" />-->
      <!--            <el-table-column :label="$t('MOIC')" align="center" prop="moic" show-overflow-tooltip width="100" />-->
      <!--          </el-table>-->
      <!--        </div>-->
      <!--      </el-col>-->
      <el-col :span="24" class="mb15">
        <div class="list-table">
          <div class="area-header finance">
            <div style="display: flex;align-items: center;">
              <span class="area-header-title">
                {{ $t('财务数据') }}
              </span>
              <el-radio-group v-model="proxyRadio" class="rightBorder" @input="proxyChange">
                <el-radio :label="0">{{ $t('概览') }}</el-radio>
              </el-radio-group>
              <el-radio-group v-model="proxyRadio" class="rightBorder" @input="proxyChange">
                <el-radio :label="1">{{ $t('指标图表') }}</el-radio>
                <el-radio :label="2">{{ $t('指标数据') }}</el-radio>
              </el-radio-group>
              <el-radio-group v-model="subjectRadio" @input="subjectChange">
                <el-radio :label="1">{{ $t('科目图表') }}</el-radio>
                <el-radio :label="2">{{ $t('科目数据') }}</el-radio>
              </el-radio-group>
            </div>
            <template v-if="proxyRadio == '0'">
              <div class="rightSelect">
                <DatePicker v-model="year" size="mini" type="year" :clearable="false" value-format="yyyy" :placeholder="$t('年份')" @change="getFinancialSummary" />
              </div>
            </template>
            <div v-if="proxyRadio !== 0" style="display: flex;column-gap: 20px;">
              <el-checkbox-group v-model="typeGroup" size="mini" @change="onchange">
                <el-checkbox-button v-for="type in dataSourceOptions" :key="type.dictValue" :label="type.dictValue">{{ selectDictLabel(dataSourceOptions,type.dictValue) }}</el-checkbox-button>
              </el-checkbox-group>
              <el-radio-group v-model="financeQuarter" size="mini" @input="changeQuarter">
                <el-radio-button :label="'quarter'">{{ $t('季度') }}</el-radio-button>
                <el-radio-button :label="'year'">{{ $t('年度') }}</el-radio-button>
              </el-radio-group>
            </div>
          </div>
          <div v-show="proxyRadio === 1 || subjectRadio === 1" class="chartDom" style="height:330px;">
            <el-select v-model="selectVal" filterable size="mini" :placeholder="$t('请选择')" @change="changeVal">
              <el-option v-for="key in keyOptions" :key="key.keyCode" :label="key.keyName" :value="key.keyCode" />
            </el-select>
            <div style="height:350px;width:100%">
              <Empty :data.sync="barChartData.datas">
                <barLineChart v-if="barChartData.datas.length > 0" ref="barChart" :chart-data="barChartData" height="100%" />
              </Empty>
            </div>
          </div>
          <div v-show="proxyRadio === 2" v-loading="pcwLoading">

            <el-table
              v-if="!pcwLoading"
              v-loading="pcwLoading"
              :data="pcwDataKeysList"
              height="350"
              border
              :span-method="objectSpanMethod"
            >
              <el-table-column
                v-for="(item, index) in baseTit"
                :key="item.uuidKey"
                :fixed="index < 2"
                :min-width="index < 2 ? '120' : '180'"
                :label="$t(item.label)"
                align="center"
                :prop="item.prop"
              >
                <template slot-scope="scope">
                  <!--                  <span v-if="index === 3">-->
                  <!--                    <span>{{ JSON.stringify(scope.row[item.prop])+','+item.prop }}</span>-->
                  <!--                  </span>-->
                  <span v-if="index < 2" :style="{'font-weight': scope.row['focusOn'] === 'Y' ? 'bolder' : ''}">
                    {{ $t(scope.row[item.prop]) }}
                  </span>
                  <span v-else class="alignRight">
                    <span :style="{'font-weight': scope.row['focusOn'] === 'Y' ? 'bolder' : ''}">{{ scope.row[item.prop] ? (scope.row['keyType'] === 'ratio' ? moneyFormat((scope.row[item.prop]['val']) * 100) + '%' : moneyFormat(scope.row[item.prop]['val'])) : scope.row[item.prop] }}</span>
                  </span>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <div v-show="proxyRadio === 0" v-loading="pcwLoading">
            <el-row :gutter="20">
              <el-col :span="24">
                <el-table
                  v-if="!pcwLoading"
                  v-loading="pcwLoading"
                  :data="financeSumData.data"
                  height="350"
                  border
                  class="overviewTable"
                  :cell-style="cellStyle"
                >
                  <el-table-column
                    v-for="(item, index) in financeSumData.columns"
                    :key="item.uuidKey"
                    :fixed="index < 1"
                    :min-width="index < 1 ? '100' : item.prop && item.prop.indexOf('change') === -1 ? '150' : '90'"
                    :width="item.prop === 'null' ? '20' : index < 1 ? '130' : ''"
                    :label="$t(item.prop === 'null' ? '' : item.label)"
                    align="center"
                    :prop="item.prop"
                    :class-name="item.prop === 'null' ? 'empty' : index === 0 ? 'first' : index === financeSumData.columns.length - 1 ? 'last' : ''"
                  >
                    <template slot-scope="scope">
                      <!--                  <span v-if="index === 3">-->
                      <!--                    <span>{{ JSON.stringify(scope.row[item.prop])+','+item.prop }}</span>-->
                      <!--                  </span>-->
                      <span v-if="index < 1">
                        {{ $t(scope.row[item.prop]) }}
                      </span>
                      <span v-else-if="item.prop && item.prop.indexOf('change') === -1" class="alignRight">
                        <span v-if="scope.row.keyType === 'ratio'">{{ scope.row[item.prop] ? moneyFormat((scope.row[item.prop].val)*100,'',null,true) + '%' : '' }}</span>
                        <span v-else>{{ scope.row[item.prop] ? moneyFormat(scope.row[item.prop].val,'',null,true) : '' }}</span>
                      </span>
                      <span v-else class="alignRight">
                        <span>{{ scope.row[item.prop+'_'+scope.row['keyCode']] ? moneyFormat(scope.row[item.prop+'_'+scope.row['keyCode']].tbv,'',null,true) + '%' : '' }}</span>
                        <span v-if="scope.row[item.prop+'_'+scope.row['keyCode']] && scope.row[item.prop+'_'+scope.row['keyCode']].tbv_icon !== '-'" :style="{color: scope.row[item.prop+'_'+scope.row['keyCode']] && scope.row[item.prop+'_'+scope.row['keyCode']].tbv_icon === 'asc' ? 'red' : 'green'}">{{ scope.row[item.prop+'_'+scope.row['keyCode']] && scope.row[item.prop+'_'+scope.row['keyCode']].tbv_icon === 'asc' ? '⬆' : '⬇' }}</span>
                      </span>
                    </template>
                  </el-table-column>
                </el-table>
                <el-empty v-else description="空数据" />
              </el-col>
              <!--              <el-col :span="5">-->
              <!--                <el-table-->
              <!--                  :data="overview.tj.data"-->
              <!--                  height="500"-->
              <!--                  border-->
              <!--                >-->
              <!--                  <el-table-column-->
              <!--                    v-for="(item, index) in overview.tj.columns"-->
              <!--                    :key="item.prop"-->
              <!--                    :fixed="index < 1"-->
              <!--                    :min-width="index < 1 ? '120' : '180'"-->
              <!--                    :label="$t(item.label)"-->
              <!--                    align="center"-->
              <!--                    :prop="item.prop"-->
              <!--                  >-->
              <!--                    <template slot-scope="scope">-->
              <!--                      &lt;!&ndash;                  <span v-if="index === 3">&ndash;&gt;-->
              <!--                      &lt;!&ndash;                    <span>{{ JSON.stringify(scope.row[item.prop])+','+item.prop }}</span>&ndash;&gt;-->
              <!--                      &lt;!&ndash;                  </span>&ndash;&gt;-->
              <!--                      <span v-if="index < 1">-->
              <!--                        {{ $t(scope.row[item.prop]) }}-->
              <!--                      </span>-->
              <!--                      <span v-else class="alignRight">-->
              <!--                        <span>{{ moneyFormat(scope.row[item.prop],'w') }}</span>-->
              <!--                      </span>-->
              <!--                    </template>-->
              <!--                  </el-table-column>-->
              <!--                </el-table>-->
              <!--              </el-col>-->
              <!--              <el-col :span="9">-->
              <!--                <el-table-->
              <!--                  :data="overview.last.data"-->
              <!--                  height="500"-->
              <!--                  border-->
              <!--                >-->
              <!--                  <el-table-column-->
              <!--                    v-for="(item, index) in overview.last.columns"-->
              <!--                    :key="item.prop"-->
              <!--                    :fixed="index < 1"-->
              <!--                    :min-width="index < 1 ? '120' : '180'"-->
              <!--                    :label="$t(item.label)"-->
              <!--                    align="center"-->
              <!--                    :prop="item.prop"-->
              <!--                  >-->
              <!--                    <template slot-scope="scope">-->
              <!--                      &lt;!&ndash;                  <span v-if="index === 3">&ndash;&gt;-->
              <!--                      &lt;!&ndash;                    <span>{{ JSON.stringify(scope.row[item.prop])+','+item.prop }}</span>&ndash;&gt;-->
              <!--                      &lt;!&ndash;                  </span>&ndash;&gt;-->
              <!--                      <span v-if="index < 1">-->
              <!--                        {{ $t(scope.row[item.prop]) }}-->
              <!--                      </span>-->
              <!--                      <span v-else class="alignRight">-->
              <!--                        <span>{{ moneyFormat(scope.row[item.prop],'w') }}</span>-->
              <!--                      </span>-->
              <!--                    </template>-->
              <!--                  </el-table-column>-->
              <!--                </el-table>-->
              <!--              </el-col>-->
            </el-row>
          </div>
          <div v-show="subjectRadio === 2">
            <el-table v-loading="pcwLoading" tooltip-effect="darkTable" :data="courseList.data" border height="350">
              <el-table-column v-for="(subject,index) in courseList.columns" :key="subject.prop" :label="$t(index === 0 ? subject.label : subject.labelYear + '-' + subject.labelType + '-' + subject.labelSource)" align="center" :prop="subject.prop" :fixed="subject.prop === 'subjectName' ? 'left' : false">
                <template slot-scope="scope">
                  <span v-if="index < 1">{{ scope.row[subject.prop] }}</span>
                  <span v-else>{{ moneyFormat(scope.row[subject.prop]['val']) }}</span>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </el-col>
      <el-col v-if="!isHide" :span="24" class="mb15">
        <div v-loading="loading" class="list-table">
          <div class="area-header finance">
            <div style="display: flex;align-items: center;">
              <span class="area-header-title">
                {{ $t('KPI数据') }}
              </span>
              <el-radio-group v-model="kpiRadio" class="" @input="onInput">
                <el-radio :label="3">{{ $t('概览') }}</el-radio>
                <el-radio :label="1">{{ $t('运营数据') }}</el-radio>
                <el-radio :label="2">{{ $t('关键指标') }}</el-radio>
              </el-radio-group>
            </div>
            <div v-if="kpiRadio !== 3">
              <el-radio-group v-model="kpiQuarter" size="mini" @input="checkKpiQuarter">
                <el-radio-button v-if="indicator && indicator.cycle !== 'year' && indicator && indicator.cycle !== 'quarter'" :label="0">{{ $t('月度') }}</el-radio-button>
                <el-radio-button v-if="indicator && indicator.cycle !== 'year'" :label="1">{{ $t('季度') }}</el-radio-button>
                <el-radio-button :label="2">{{ $t('年度') }}</el-radio-button>
              </el-radio-group>
            </div>
          </div>
          <div v-if="kpiRadio !== 3" class="chartDom" style="height: 350px">
            <el-select v-model="kpiSelectVal" filterable size="mini" :placeholder="$t('请选择')" @change="changeIndicator">
              <el-option v-for="item in operatOptions" :key="item.id" :label="kpiRadio === 1 ? item.indicators : item.keyName" :value="item.id" />
            </el-select>
            <div v-show="kpiRadio === 1" id="echarts1" style="height:350px;" />
            <div v-if="kpiRadio === 2" id="echarts2" style="height:350px;" />
          </div>
          <div v-if="kpiRadio === 3" style="height: 350px; overflow: auto">
            <leaderEvaluate ref="leaderEvaluate" :all-view-model="false" />
          </div>
        </div>
      </el-col>
      <el-col :span="24" class="mb15">
        <el-row :gutter="15">
          <el-col :span="isExpanded ? 24 : 12">
            <div class="list-table">
              <span class="arrow" @click="isExpanded = !isExpanded"><i :class="isExpanded ? 'el-icon-arrow-left' : 'el-icon-arrow-right'" /></span>
              <div class="area-header">
                <span class="area-header-title">{{ $t(' 项目最新事件') }}</span>
              </div>
              <div style="height: 400px;">
                <dealEvent ref="dealEvent" :height="'calc(100% - 50px)'" :deal-id="businessId" />
              </div>
            </div>
          </el-col>
          <el-col v-if="!isExpanded" :span="12">
            <div class="list-table">
              <div class="area-header flex-between">
                <span class="area-header-title">{{ $t('项目计划') }}</span>
                <div>
                  <el-button
                    type="warning"
                    icon="el-icon-pie-chart"
                    size="mini"
                    @click="openGanttEcharts()"
                  >{{ $t('甘特图') }}
                  </el-button>
                  <el-button
                    type="primary"
                    icon="el-icon-plus"
                    size="mini"
                    @click="addHandle"
                  >{{ $t('新增') }}
                  </el-button>
                </div>
              </div>
              <el-table tooltip-effect="darkTable" default-expand-all row-key="id" :data="projectPlanList" border height="390px" @sort-change="dataSort">
                <el-table-column show-overflow-tooltip :label="$t('事项名称')" align="left" min-width="120px" prop="itemName" />
                <el-table-column show-overflow-tooltip :label="$t('事项负责人')" sortable="custom" min-width="130" align="center" prop="personChargeName" />
                <el-table-column show-overflow-tooltip :label="$t('预计开始时间')" sortable="custom" min-width="130" align="center" prop="estimatedStartTime">
                  <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.estimatedStartTime) }}</span>
                  </template>
                </el-table-column>
                <el-table-column show-overflow-tooltip :label="$t('实际完成时间')" align="center" min-width="130" prop="actualTime" sortable="custom">
                  <template slot-scope="scope">
                    <span>{{ parseTime(scope.row.actualTime) }}</span>
                  </template>
                </el-table-column>
                <el-table-column :label="$t('操作')" align="center" prop="action" width="120">
                  <!-- <template slot="header" slot-scope="">
                    操作
                    <i class="el-icon-circle-plus-outline link-type" />
                  </template> -->
                  <template slot-scope="scope">
                    <!-- <i class="el-icon-circle-plus-outline link-type mr5" /> -->
                    <i v-hasPermi="['deal:supervise:edit']" class="el-icon-edit-outline link-type mr5" @click="updateHandle(scope.row)" />
                    <i v-hasPermi="['deal:supervise:remove']" class="el-icon-delete link-type" @click="deleteHandle(scope.row)" />
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="24" class="mb15">
        <div v-loading="loading" class="list-table">
          <div class="area-header finance">
            <div>
              <span class="area-header-title">
                {{ $t('退出决策') }}
              </span>
            </div>
          </div>
          <div style="max-height: 180px">
            <el-table v-loading="loading" max-height="180px" tooltip-effect="darkTable" :data="dealExitList" border>
              <el-table-column :label="$t('退出策略')" align="center" prop="exitStrategy" min-width="150" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span :class="scope.row.id ? 'link-type' : ''" @click="dealExitHandler(scope.row,scope.row.id ? 'yes' : 'no')">{{ selectDictLabel(dealExitTypeOptions,scope.row.exitStrategy) }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('拟退出时间')" align="center" prop="draftExitTime" min-width="90" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ parseTime(scope.row.draftExitTime,'{y}-{m}-{d}') }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('拟退出持股比例(%)')" align="center" prop="draftExitShareholdingRatio" min-width="100" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ scope.row.draftExitShareholdingRatio }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('拟退出金额') + $t('金额单位')" align="center" prop="draftExitPrice" min-width="100" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ moneyFormat(scope.row.draftExitPrice,'w') }}</span>
                </template>
              </el-table-column>
              <!--              <el-table-column :label="$t('退出方式')" align="center" prop="exitMode" min-width="100">-->
              <!--                <template slot-scope="scope">-->
              <!--                  <span>{{ selectDictLabel(exitModeOptions,scope.row.exitMode) }}</span>-->
              <!--                </template>-->
              <!--              </el-table-column>-->
              <!--              <el-table-column :label="$t('备选退出方式')" align="center" prop="spareWay" min-width="100">-->
              <!--                <template slot-scope="scope">-->
              <!--                  <span>{{ selectDictLabel(exitModeOptions,scope.row.spareWay ) }}</span>-->
              <!--                </template>-->
              <!--              </el-table-column>-->
              <el-table-column :label="$t('优先退出方式')" align="center" prop="priorWay" min-width="100" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ selectDictLabel(exitModeOptions,scope.row.priorWay) }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('备选退出方式')" align="center" prop="spareWay" min-width="100" show-overflow-tooltip>
                <template slot-scope="scope">
                  <span>{{ selectDictLabel(exitModeOptions,scope.row.spareWay ) }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('倍数')" align="center" show-overflow-tooltip prop="multiple" min-width="100" show-tooltip-when-overflow>
                <template slot-scope="scope">
                  <span>{{ scope.row.multiple }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('IRR')" show-overflow-tooltip align="center" prop="irr" min-width="100" show-tooltip-when-overflow>
                <template slot-scope="scope">
                  <span>{{ scope.row.irr }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('操作')" align="center" min-width="100">
                <template slot-scope="scope">
                  <el-button type="text" size="mini" @click="dealExitHandler(scope.row)">{{ $t(scope.row.id ? '查看' : '新增') }}</el-button>
                </template>
              </el-table-column>
            </el-table>
          </div>
        </div>
      </el-col>
      <el-col :span="24" class="mb15">
        <el-row :gutter="15">
          <el-col :span="12">
            <div class="list-table">
              <div class="area-header flex-between">
                <span class="area-header-title">{{ $t('关键条款') }}</span>
              </div>
              <!--              <el-table tooltip-effect="darkTable" :data="dealContractTermsList" border height="220">-->
              <!--                <el-table-column :label="$t('条款类型')" align="left" prop="type">-->
              <!--                  <template slot-scope="scope">-->
              <!--                    <span class="link-type">{{ scope.row.type }}</span>-->
              <!--                  </template>-->
              <!--                </el-table-column>-->
              <!--                <el-table-column :label="$t('触发状态')" align="center" prop="isTrigger" width="100">-->
              <!--                  <template slot-scope="scope">-->
              <!--                    <el-tag v-if="scope.row.isTrigger === '未触发'" type="warning" size="mini">{{ scope.row.isTrigger }}</el-tag>-->
              <!--                    <el-tag v-if="scope.row.isTrigger === '已触发'" type="danger" size="mini">{{ scope.row.isTrigger }}</el-tag>-->
              <!--                  </template>-->
              <!--                </el-table-column>-->
              <!--              </el-table>-->
              <Terms ref="refTerms" :show-header="false" height="220px" :business-id="businessId" />
            </div>
          </el-col>
          <el-col :span="12">
            <div class="list-table">
              <div class="area-header flex-between">
                <span class="area-header-title">{{ $t('指标预警') }}</span>
              </div>
              <!-- :buss-id="companyId" -->
              <PcwRiskMonitorInfo ref="PcwRiskMonitorInfo" :buss-id="companyId" height="220px" />
            </div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="24" class="mb15">
        <el-row :gutter="15">
          <el-col :span="12">
            <div class="list-table">
              <div class="area-header flex-between">
                <span class="area-header-title">{{ $t('最新股东') }}</span>
                <a style="cursor: pointer;font-size: 14px" class="link_a" @click="companyHolderHanle">股东结构图</a>
              </div>
              <company-new-holder-info ref="companyHolderHnfo" height="260px" :buss-id="companyId" />
            </div>
          </el-col>
          <el-col :span="12">
            <div class="list-table">
              <div class="area-header flex-between">
                <span class="area-header-title">
                  {{ $t('融资情况') }}
                </span>
                <el-radio-group v-model="financeType" class="">
                  <el-radio :label="$t('融资历史')">{{ $t('融资历史') }}</el-radio>
                  <el-radio :label="$t('融资历史(外部数据)')">{{ $t('融资历史(外部数据)') }}</el-radio>
                  <el-radio :label="$t('后续融资计划')">{{ $t('后续融资计划') }}</el-radio>
                </el-radio-group>
              </div>
              <finance-info :height="260" :is-custom="true" :component-type="financeType" />
            </div>
          </el-col>
        </el-row>
      </el-col>
      <el-col :span="24">
        <div class="list-table">
          <div class="area-header" style="display: flex;align-items: center;">
            <span class="area-header-title">{{ $t('项目现金流') }}</span>
            <el-radio-group v-model="cashFlowRadio" @input="onCashFlow">
              <el-radio :label="1">{{ $t('指标') }}</el-radio>
              <el-radio :label="2">{{ $t('现金流') }}</el-radio>
              <el-radio :label="3">{{ $t('估值变化') }}</el-radio>
            </el-radio-group>
          </div>
          <el-table v-show="cashFlowRadio === 1" v-loading="loading" tooltip-effect="darkTable" :data="quotaList.data" class="quotaList" border max-height="235">
            <el-table-column v-for="col in quotaList.columns" :key="col.prop" :width="col.prop === 'type' ? '120' : ''" :label="$t(col['label'])" align="center" prop="quota" :fixed="col.prop === 'type'?'left' : false" min-width="110">
              <template slot-scope="scope">
                <span v-if="col.prop === 'type'">{{ scope.row['type'] ? selectDictLabel(indicatorOptions,scope.row['type']) : '' }}</span>
                <span v-else-if="scope.row['type'] === 'dealIrr' || scope.row['type'] === 'dealMoic'">
                  <el-link v-if="scope.row['type'] === 'dealIrr'" type="primary" @click="findXIrrDetails(scope.row[col.prop].id)">{{ scope.row[col.prop] ? moneyFormat(scope.row[col.prop].xirr, undefined, 2, true) : '' }}</el-link>
                  <span v-else>{{ scope.row[col.prop] ? scope.row[col.prop].xirr : '' }}</span>
                </span>
                <span v-else>{{ moneyFormat(scope.row[col.prop],'w') }}</span>
              </template>
            </el-table-column>
          </el-table>
          <div v-show="cashFlowRadio === 2">
            <el-table v-loading="loading" tooltip-effect="darkTable" :data="dealCashflowList" border>
              <el-table-column :label="$t('承担主体')" align="center" prop="investorName" min-width="150">
                <template slot-scope="scope">
                  <span class="link-type">{{ scope.row.investorName }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('业务类型')" align="center" prop="operateType" min-width="90">
                <template slot-scope="scope">
                  <span>{{ selectDictLabel(operateTypeOptions,scope.row.operateType) }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('发生时间')" align="center" prop="operateDate" min-width="100">
                <template slot-scope="scope">
                  <span>{{ parseTime(scope.row.operateDate,'{y}-{m}-{d}') }}</span>
                </template>
              </el-table-column>
              <el-table-column :label="$t('发生金额') + $t('金额单位')" align="center" prop="operateAmount" min-width="100">
                <template slot-scope="scope">
                  <span>{{ moneyFormat(scope.row.operateAmount,'w') }}</span>
                </template>
              </el-table-column>
            </el-table>
            <pagination
              v-show="cashflowTotal>0"
              :total="cashflowTotal"
              :page.sync="cashflowParams.pageNum"
              :limit.sync="cashflowParams.pageSize"
              @pagination="getCashflowList"
            />
          </div>
          <!-- <div v-show="cashFlowRadio === 3" id="echarts3" style="height:230px;" /> -->
          <div v-show="cashFlowRadio === 3" style="width: 100%;height:300px;">
            <lineChart v-if="chartData.datas.length > 0" height="100%" :chart-data="chartData" />
            <div v-else class="noneData">
              <div>
                <svg-icon icon-class="none" class-name="none-icon" />
                <p>{{ $t('暂无数据') }}</p>
              </div>
            </div>
          </div>
        </div>
      </el-col>
    </el-row>
    <el-dialog :title="$t('关键条款')" :visible.sync="dealTermsOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <dealContractTermsForm ref="dealContractTermsForm" />
    </el-dialog>
    <el-dialog :title="$t('添加项目计划')" :visible.sync="formOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <dealSuperviseForm ref="dealSuperviseForm" />
    </el-dialog>
    <el-dialog :title="$t('甘特图')" :visible.sync="ganttHomeOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <ganttHome ref="ganttHome" />
    </el-dialog>
    <el-dialog :title="$t('股东结构图')" :visible.sync="companyHolderOpen" :close-on-click-modal="false" :lock-scroll="false" append-to-body>
      <!-- <div id="companyHolder" style="width: 100%; height: 500px;" /> -->
      <pieChart v-if="holderChartData.datas.length > 0" :chart-data="holderChartData" height="500px" />
    </el-dialog>

    <el-dialog :title="$t('项目风险')" :visible.sync="dealRiskOpen" :close-on-click-modal="false" :lock-scroll="false" append-to-body>
      <deal-risk-list-info />
    </el-dialog>

    <el-dialog :title="$t('财报监控')" :visible.sync="pcwRiskOpen" :close-on-click-modal="false" :lock-scroll="false" append-to-body>
      <!--      <pcw-risk-monitor-list ref="pcwRisk" :company-id="$route.query.companyId" />-->
      <PcwRiskMonitorInfo ref="PcwRiskMonitorInfo" :buss-id="$route.query.companyId" height="220px" />

    </el-dialog>

    <el-dialog :title="$t('重大事项')" :visible.sync="dealMatterOpen" :close-on-click-modal="false" :lock-scroll="false" append-to-body>
      <deal-matters-info :buss-id="$route.query.id" />
    </el-dialog>

    <el-dialog :title="$t('退出决策')" :visible.sync="dealExitOpen" :close-on-click-modal="false" :lock-scroll="false" custom-class="dialogForm" append-to-body>
      <dealExitForm ref="dealExitForm" to="home" />
    </el-dialog>

    <!-- 添加或修改xIrr计算明细对话框 -->
    <el-dialog :title="$t('计算明细')" :visible.sync="xIrrOpen" :close-on-click-modal="false" :lock-scroll="false" :width="'50%'" custom-class="customDialog" append-to-body>
      <xIrrBaseDetailsList ref="xIrrBaseDetailsList" />
      <div slot="footer" class="dialog-footer mt-15" style="text-align: right;">
        <el-button
          type="warning"
          icon="el-icon-download"
          size="mini"
          @click="exportXIrrHandle"
        >{{ $t('导出') }}
        </el-button>
      </div>
    </el-dialog>
  </div>
</template>
<script>
// import bussRisk from '@/views/deal/bussRisk/bussRisk'
import PcwRiskMonitorInfo from '@/components/Deal/pcwRiskMonitorInfo'
// import CompanyFinanceInfo from '@/components/Deal/companyFinanceInfo'
import dealEvent from '@/components/dealEvent'
import dealContractTermsForm from '@/views/deal/terms/dealTermsForm.vue'
import ganttHome from '@/views/deal/supervise/dhtmlxGantt/Home.vue'
import dealSuperviseForm from '@/views/deal/supervise/dealSuperviseForm.vue'
import * as echarts from 'echarts'
require('echarts/theme/macarons')
import { getCompanyBaseByDealId } from '@/api/company/base/companyBase'
import { getNewHolderByCompanyId } from '@/api/company/holder/companyHolderChange'
import { companyValuationChart } from '@/api/deal/companyvaluation/dealCompanyValuation'
import { getByIdFindPostInvestmentInformation } from '@/api/deal/investment/dealInvestment'
import { getDealBaseHomeInfo, getDealCashFLowInfo, getDealInfo, getDicts } from '@/api/base/deal/dealBase'
import { listDealCashflow } from '@/api/deal/cashflow/dealCashflow'
import Terms from '@/components/Terms'
import { delDealSupervise, findListTreeInDeal } from '@/api/deal/supervise/dealSupervise'
import { getAllData } from '@/api/deal/indicator/dealIndicatorPredict'
import { getDealIndicatorDataMainByDealId } from '@/api/deal/indicator/data/dealIndicatorDataMain'
// import { listDealIndicatorDataDetail } from '@/api/deal/indicator/data/dealIndicatorDataDetail'
import Decimal from 'decimal.js'
import { listDealIndicatorPredictKey } from '@/api/deal/indicator/dealIndicatorPredictKey'
import DealExitForm from '@/views/deal/exit/dealExitForm'
import leaderEvaluate from '@/views/deal/report/leaderEvaluate'
import pieChart from '@/views/chart/pieChart'
import lineChart from '@/views/chart/lineChart.vue'
import barLineChart from '@/views/chart/barLineChart.vue'
import {
  getFinancialSummary,
  getKeys,
  getPcwDataKeys,
  getPcwDataKeysByCharts, getPcwFocusCharts,
  getPcwFocusSubject,
  getPcwSubjectList
} from '@/api/pcw/pcwChart'

import DealMattersInfo from '@/components/Deal/dealMattersInfo'
import DealRiskListInfo from '@/components/Deal/dealRiskListInfo'
import CompanyNewHolderInfo from '@/components/Deal/companyNewHolderInfo'
import { getDealExitList } from '@/api/deal/exit/dealExit'
import FinanceInfo from '@/components/Deal/FinanceInfo'
import xIrrBaseDetailsList from '@/components/Xirr/details/xirrBaseDetailsList'
import Cookies from 'js-cookie'
export default {
  components: {
    leaderEvaluate,
    FinanceInfo,
    CompanyNewHolderInfo,
    DealRiskListInfo,
    DealMattersInfo,
    // bussRisk,
    PcwRiskMonitorInfo,
    dealSuperviseForm,
    ganttHome,
    dealContractTermsForm,
    // CompanyFinanceInfo,
    dealEvent,
    Terms,
    DealExitForm,
    xIrrBaseDetailsList,
    pieChart,
    lineChart,
    barLineChart
  },
  data() {
    return {
      isExpanded: false,
      investVal: '',
      cashflowTotal: 0,
      cashflowParams: {
        pageNum: 1,
        pageSize: 10,
        dealId: this.$route.query.id
      },
      chartData: {
        datas: []
      },
      dealExitOpen: false,
      companyData: {},
      isHide: true,
      investList: [],
      investInfoData: {},
      businessId: this.$route.query.id,
      companyId: this.$route.query.companyId,
      ganttHomeOpen: false,
      dealTermsOpen: false,
      formOpen: false,
      proxyRadio: 0,
      isFullscreen: true,
      overview: {
        'tb': {
          columns: [
            {
              label: '指标',
              prop: 'keyName'
            },
            {
              label: '2020年(审计)',
              prop: 'sj_2020'
            },
            {
              label: '同比',
              prop: 'tb_2020'
            },
            {
              label: '2021年(审计)',
              prop: 'sj_2021'
            },
            {
              label: '同比',
              prop: 'tb_2021'
            },
            {
              label: '2022年(审计)',
              prop: 'sj_2022'
            },
            {
              label: '同比',
              prop: 'tb_2022'
            },
            {
              label: 'null',
              'prop': 'null'
            },
            {
              label: '2023年度(预算)',
              prop: 'ys_2023'
            },
            {
              label: '2023年度(投决)',
              prop: 'tj_2023'
            },
            {
              label: 'null',
              'prop': 'null'
            },
            {
              label: '2023年3月',
              prop: 'month_2023'
            },
            {
              label: '2022年3月',
              prop: 'month_2022'
            },
            {
              label: '同比',
              prop: 'tb'
            }
          ],
          data: [
            {
              keyName: '收入',
              'sj_2020': '120',
              'tb_2020': '1200',
              'sj_2021': '12000',
              'tb_2021': '12000',
              'sj_2022': '120000',
              'tb_2022': '1200000',
              'tj_2023': 10000,
              'ys_2023': 100000,
              'month_2023': 10000,
              'month_2022': 100000,
              tb: 30000
            }
          ]
        }
      },
      subjectRadio: '',
      typeRadio: 4,
      quarterRadio: 2,
      options: [],
      selectVal: '',
      kpiSelectVal: '',
      kpiSelectLabel: '',
      typeGroup: [],
      financeQuarter: 'quarter',
      kpiRadio: 3,
      kpiQuarter: 0,
      dealRiskOpen: false,
      pcwRiskOpen: false,
      dealMatterOpen: false,
      xIrrOpen: false,
      projectPlanList: [
      ],
      dealInvestmentList: [],
      quotaList: {
        columns: [],
        data: []
      },
      columnList: [],
      kpiList: [],
      courseList: {
        columns: [],
        data: []
      },
      dealDatainfo: {},
      dealCashflowList: [
      ],
      // 业务类型字典
      operateTypeOptions: [],
      loading: false,
      cashFlowRadio: 1,
      chart: null,
      chart1: null,
      chart2: null,
      chart3: null,
      investActive: '',
      companyHolderOpen: false,
      holders: [],
      matterOptions: [],
      // 指标字典
      indicatorOptions: [],
      // 运营指标
      operatOptions: [],
      financeType: '融资历史',
      pcwLoading: true,
      // 运营指标数据
      indicator: {},
      indicatorDetails: [],
      actIndicators: [],
      pcwDataKeysList: [],
      baseTit: [],
      // 数据来源字典
      dataSourceOptions: [],
      // 关键指标
      keyOptions: [],
      year: Cookies.get('pcwYear') || new Date().getFullYear().toString(),
      financeSumData: {},
      pcwDataQuery: {
        type: 'quarter',
        dataSource: [],
        companyId: this.$route.query.companyId,
        keyCode: undefined
      },
      dealExitList: [],
      dealExitTypeOptions: [],
      exitModeOptions: [],
      focusOptions: [],
      levelOptions: [],
      currency: undefined,
      currencyOptions: [],
      holderChartData: {
        datas: []
      },
      barChartData: {
        datas: []
      }
    }
  },
  computed: {
    noMore() {
      return true
    },
    disabled() {
      return true
    }
  },
  created() {
    this.getFinancialSummary()
    this.getDicts('currency').then(res => {
      this.currencyOptions = res.data
    })
    this.getDicts('deal_matters_category').then(res => {
      this.matterOptions = res.data
    })
    this.getDicts('deal_industry_focus').then(res => {
      this.focusOptions = res.data
    })
    this.getDicts('deal_level_type').then(res => {
      this.levelOptions = res.data
    })
  },
  mounted() {
    getDicts().then(res => {
      this.indicatorOptions = res.data
    })
    this.getDicts('deal_exit_strategy').then(res => {
      this.dealExitTypeOptions = res.data
    })
    this.getDicts('exit_mode').then(res => {
      this.exitModeOptions = res.data
    })
    this.getDicts('pcw_data_source').then(res => {
      if (res.data && res.data.length > 1) {
        this.typeGroup = [res.data[0].dictValue, res.data[1].dictValue]
      } else if (res.data && res.data.length > 0) {
        this.typeGroup = [res.data[0].dictValue]
      }
      this.dataSourceOptions = res.data
      // 获取财务数据关键指标
      getKeys(this.$route.query.companyId).then(res => {
        this.keyOptions = res.data
        if (this.keyOptions && this.keyOptions.length > 0) {
          this.selectVal = res.data[0].keyCode
          this.$nextTick(() => {
            this.initChart()
          })
        }
      })
    })
    this.getDicts('deal_cash_flow_type').then(response => {
      this.operateTypeOptions = response.data
    })
    // 获取退出策略
    this.getDealExitList()
    // 获取右侧信息
    getDealBaseHomeInfo(this.$route.query.id, this.$route.query.companyId).then(res => {
      this.dealDatainfo = res.data
    })
    // 获取财务数据关键指标
    getKeys(this.$route.query.companyId).then(res => {
        this.keyOptions = res.data
        if (this.keyOptions && this.keyOptions.length > 0) {
          this.selectVal = res.data[0].keyCode
        }
        this.initChart()
    })
    // 获取运营数据
    this.getIndicatorData()
    this.init()
    this.getDealCashFLowInfo({ dealId: this.$route.query.id, type: this.cashFlowRadio })
    this.getProjectPlanList()
    window.addEventListener('resize', this.initDrawChart)
  },
  destroyed() {
    window.removeEventListener('resize', this.initDrawChart)
  },
  methods: {
    onFullscreen(is) {
      this.isFullscreen = is
    },
    cellStyle({ columnIndex }) {
      if (columnIndex === 3 || columnIndex === 4) {
        return 'background-color:#F5F7FA'
      }
    },
    initDrawChart() {
      if (this.chart) {
        this.chart.resize()
      }
      if (this.chart1) {
        this.chart1.resize()
      }
      if (this.chart2) {
        this.chart2.resize()
      }
      if (this.chart3) {
        this.chart3.resize()
      }
    },
    dealExitHandler(row, type = 'yes') {
      if (type === 'no') {
        return false
      }
      this.dealExitOpen = true
      this.$nextTick(() => {
        if (row.id) {
          this.$refs.dealExitForm.init(row)
        } else {
          row.id = undefined
          this.$refs.dealExitForm.init(row)
        }
      })
    },
    reset() {},
    getDealExitList() {
      this.loading = true
      getDealExitList(this.$route.query.id).then(res => {
        this.dealExitList = res.data
        this.loading = false
      })
    },
    // 排序
    dataSort(column) {
      this.loading = true
      var query = {}
      if (column.order !== null && column.order !== undefined && column.order !== '') {
        query.prop = column.prop
        if (column.order === 'ascending') {
          query.order = 'asc'
        } else if (column.order === 'descending') {
          query.order = 'desc'
        }
      } else {
        query.prop = undefined
        query.order = undefined
      }
      this.getProjectPlanList(query)
    },
    openForm(type) {
      if (type === 1) {
        this.dealRiskOpen = true
      }
      if (type === 2) {
        this.pcwRiskOpen = true
      }
      if (type === 3) {
        this.dealMatterOpen = true
      }
    },
    queryRest() {
      this.pcwDataQuery = {
        type: 'quarter',
          dataSource: [],
          companyId: this.$route.query.companyId,
          keyCode: undefined
      }
    },
    subjectChange(val) {
      this.proxyRadio = ''
      this.financeQuarter = 'quarter'
      this.queryRest()
      if (val === 2) {
        this.getPcwSubjectList()
      } else {
        this.keyOptions = []
        this.selectVal = ''
        // 获取财务数据关键指标
        getPcwFocusSubject(this.$route.query.companyId).then(res => {
          this.keyOptions = res.data
          if (this.keyOptions && this.keyOptions.length > 0) {
            this.selectVal = res.data[0].keyCode
          }
          this.initChart()
        })
      }
    },
    getFinancialSummary(val) {
      this.pcwLoading = true
      if (val) {
        Cookies.set('pcwYear', this.year + '')
      }
      getFinancialSummary({ companyId: this.$route.query.companyId, year: this.year + '' }).then(res => {
        console.log(res)
        this.$set(this, 'financeSumData', [])
        this.financeSumData = JSON.parse(JSON.stringify(res.data))
        this.pcwLoading = false
      })
    },
    proxyChange(val) {
      this.subjectRadio = ''
      this.financeQuarter = 'quarter'
      this.queryRest()
      if (val === 0) {
        this.getFinancialSummary()
      }
      if (val === 2) {
        this.getPcwDataKeyList()
      }
      if (val === 1) {
        this.$nextTick(() => {
          // 获取财务数据关键指标
          this.keyOptions = []
          this.selectVal = ''
          getKeys(this.$route.query.companyId).then(res => {
            this.keyOptions = res.data
            if (this.keyOptions && this.keyOptions.length > 0) {
              this.selectVal = res.data[0].keyCode
            }
            this.initChart()
          })
        })
      }
    },
    objectSpanMethod({ rowIndex, columnIndex }) {
      if (columnIndex === 0) {
        const spanArr = this.rowspan()
        for (let i = 0; i < spanArr.length; i++) {
          const _row = spanArr[rowIndex]
          return {
            rowspan: _row,
            colspan: 1
          }
        }
      }
    },
    rowspan() {
      // 二维数组，用于存放单元格合并规则
      const spanArr = []
      // 用于存储相同项的开始index
      let position = 0
      this.pcwDataKeysList.forEach((item, index) => {
        if (index === 0) {
          spanArr.push(1)
          position = 0
        } else {
          if (this.pcwDataKeysList[index].keyReport === this.pcwDataKeysList[index - 1].keyReport) {
            spanArr[position] += 1 // 有相同项
            spanArr.push(0) // 名称相同后往数组里面加一项0
          } else {
            spanArr.push(1) // 同列的前后两行单元格不相同
            position = index
          }
        }
      })
      return spanArr
    },
    changeVal() {
      this.initChart()
    },
    changeQuarter(val) {
      this.pcwDataQuery.type = val
      if (val === 'year') {
          if (this.proxyRadio === 2) {
            this.getPcwDataKeyList()
          } else {
            this.$nextTick(() => {
              this.initChart()
            })
          }
          if (this.subjectRadio === 2) {
            this.getPcwSubjectList()
          }
      } else if (val === 'quarter') {
        if (this.proxyRadio === 2) {
          this.getPcwDataKeyList()
        } else {
          this.$nextTick(() => {
            this.initChart()
          })
        }
        if (this.subjectRadio === 2) {
          this.getPcwSubjectList()
        }
      }
    },
    getPcwSubjectList() {
      this.pcwLoading = true
      this.pcwDataQuery.dataSource = this.typeGroup
      getPcwSubjectList(this.pcwDataQuery).then(res => {
        if (res.data) {
          this.courseList = res.data
        } else {
          this.courseList = {
            columns: [],
            data: []
          }
        }
        this.pcwLoading = false
      })
    },
    getPcwDataKeyList() {
      this.pcwDataQuery.dataSource = this.typeGroup
      this.pcwLoading = true
      getPcwDataKeys(this.pcwDataQuery).then(res => {
        this.baseTit = res.data.columns
        this.pcwDataKeysList = res.data.data
        this.pcwLoading = false
      })
    },
    getIndicatorData() {
      this.kpiSelectVal = undefined
      this.kpiSelectLabel = undefined
      this.operatOptions = []
      getDealIndicatorDataMainByDealId(this.$route.query.id).then(res => {
        if (res.data) {
          this.isHide = false
        } else {
          this.isHide = true
        }
        this.indicator = res.data
        this.getIndicationInit()
      })
    },
    getIndicationInit() {
      if (this.indicator && this.indicator.cycle === 'year') {
        this.kpiQuarter = 2
      } else if (this.indicator && this.indicator.cycle === 'quarter') {
        this.kpiQuarter = 1
      } else {
        if (!this.indicator) {
          this.kpiQuarter = 2
        } else {
          this.kpiQuarter = 0
        }
      }
      if (this.indicator) {
        this.getIndicatorsList(this.indicator.id)
      }
    },
    checkKpiQuarter() {
      if (this.kpiRadio === 1) {
        this.getDealIndicatorData()
      } else {
        this.loadChart()
      }
    },
    changeIndicator(val) {
      if (val) {
        console.log(this.operatOptions.find(item => item.id === val), '关键指标')
        this.kpiSelectLabel = (this.operatOptions.find(item => item.id === val))['indicators']
        if (this.kpiRadio === 2) {
          this.loadChart()
          this.chart2 = {}
          return
        }
        this.chart1 = {}
      }
      this.getDealIndicatorData()
    },
    getIndicatorsList(businessId) {
      this.operatOptions = []
      getAllData({ businessId: businessId, parentId: '0' }).then(res => {
        var rows = res.rows
        if (rows) {
          rows.forEach(item => {
            if (item.children) {
              this.operatOptions = this.operatOptions.concat(item.children)
              this.actIndicators = this.actIndicators.concat(item.children)
            }
          })
        }
        if (this.operatOptions && this.operatOptions.length > 0) {
          this.kpiSelectVal = this.operatOptions[0].id
          this.kpiSelectLabel = this.operatOptions[0].indicators
          this.getDealIndicatorData()
        }
      })
    },
    getProjectPlanList(query = {}) {
      query.dealId = this.$route.query.id
      findListTreeInDeal(query).then(response => {
        this.projectPlanList = response.rows
        // this.total = response.total
        this.loading = false
      })
    },
    investHandleClick() {},
    companyHolderHanle() {
      this.companyHolderOpen = true
    },
    getCashflowList() {
      listDealCashflow(this.addDateRange(this.cashflowParams, this.operateDates)).then(response => {
        this.dealCashflowList = response.rows
        this.cashflowTotal = response.total
        // 格式化页面list, 如果所有币种都相同, 展示一列就行
        this.loading = false
      })
    },
    init() {
      this.loading = true
      this.companyData = this.investInfoData = {}
      getCompanyBaseByDealId(this.$route.query.id, this.$route.query.companyId).then(response => {
        this.companyData = response.data
        getByIdFindPostInvestmentInformation(this.$route.query.id, 'undefined').then(response => {
          this.investInfoData = response.data[0]
          getDealInfo(this.$route.query.id).then(res => {
              this.currency = this.selectDictLabel(this.currencyOptions, res.data.dealBase.currency)
              this.$set(this.investInfoData, 'dealInfo', res.data)
          })
          if (this.investInfoData?.name !== undefined && this.investInfoData.name !== '') {
            console.log(response.data, '投资数据')
            var investName = this.investInfoData.name.split(',')
            var investId = this.investInfoData.investId.split(',')
            this.investList = []
            for (let i = 0; i < investId.length; i++) {
              var obj = {
                id: investId[i],
                name: investName[i]
              }
              this.investList.push(obj)
            }
          }
        })
        this.loading = false
      })
      var queryParams = {
        companyId: this.companyId,
        changeId: undefined
      }
      // console.log('执行了～～～', queryParams)
      getNewHolderByCompanyId(queryParams).then(response => {
        // console.log(response.data.holders, '这是数据')
        this.holders = response.data.holders || []
        this.holderChartData = {
          radius: [0, '50%'],
          center: ['50%', '50%'],
          legend: false,
          unit: '%',
          datas: []
        }
        this.holders.forEach(v => {
          var row = {
            value: v.holderRatio,
            name: v.holderName
          }
          this.holderChartData.datas.push(row)
        })
      })
    },
    addHandle() {
      this.formOpen = true
      this.$nextTick(() => {
        this.$refs.dealSuperviseForm.init(null)
      })
    },
    deleteHandle(row) {
      var that = this
      var msg = ''
      if (row.children !== undefined && row.children !== null && row.children.length > 0) {
        msg = this.$t('将会删除该事项及其子事项') + ', '
      }
      this.$confirm(msg + this.$t('是否确认删除?'), this.$t('警告'), {
        confirmButtonText: this.$t('确定'),
        cancelButtonText: this.$t('取消'),
        type: 'warning'
      }).then(function() {
        that.loading = true
        return delDealSupervise(row.id)
      }).then(() => {
        this.getProjectPlanList()
        this.msgSuccess(this.$t('删除成功'))
      }).catch(function() {
      })
    },
    updateHandle(row) {
      this.formOpen = true
      this.$nextTick(() => {
        this.$refs.dealSuperviseForm.init(row)
      })
    },
    tagClickHandler(row) {
      console.log(row, '标签数据')
      if (this.investVal === row.id) {
        this.investVal = undefined
      } else {
        this.investVal = row.id
      }
      this.loading = true
      var cpData = JSON.parse(JSON.stringify(this.investInfoData))
      getByIdFindPostInvestmentInformation(this.$route.query.id, 'undefined', this.investVal).then(response => {
        var rspData = response.data[0]
        rspData.dealInfo = cpData.dealInfo
        this.$set(this, 'investInfoData', rspData)
        getDealInfo(this.$route.query.id, this.investVal).then(res => {
          var data = res.data
          this.currency = this.selectDictLabel(this.currencyOptions, data.dealBase.currency)
          this.$set(this.investInfoData.dealInfo.cashflow, 'moic', data.cashflow.moic)
          this.$set(this.investInfoData.dealInfo.cashflow, 'dpi', data.cashflow.dpi)
        })
        this.loading = false
      })
    },
    addDealTerms() {
      this.dealTermsOpen = true
      this.$nextTick(() => {
          this.$refs.dealContractTermsForm.init(null)
      })
    },
    openGanttEcharts() {
      const dealId = this.$route.query.id
      this.ganttHomeOpen = true
      this.$nextTick(() => {
        this.$refs.ganttHome.init(dealId)
      })
    },
    onInput(val) {
      this.kpiSelectVal = ''
      this.kpiSelectLabel = ''
      this.$nextTick(() => {
        // 获取关键指标
        if (val === 1) {
          this.getIndicationInit()
        } else if (val === 2) {
          this.operatOptions = []
          listDealIndicatorPredictKey({ businessId: this.$route.query.companyId }).then(res => {
            var rows = res.data
            if (rows) {
              rows.forEach(item => {
                if (item.children) {
                  this.operatOptions = this.operatOptions.concat(item.children)
                }
              })
            }
            if (this.operatOptions && this.operatOptions.length > 0) {
              this.kpiSelectVal = this.operatOptions[0].id
              this.kpiSelectLabel = this.operatOptions[0].indicators
              this.loadChart()
            }
          })
        } else if (val === 3) {
          console.log('查看概览')
          if (this.chart1 !== undefined && this.chart1 !== null) {
            this.chart1.dispose()
          }
          if (this.chart2 !== undefined && this.chart2 !== null) {
            this.chart2.dispose()
          }
        }
        this.$forceUpdate()
      })
    },
    onCashFlow(e) {
      if (e === 3) {
        const params = {
          dealId: this.$route.query.id,
          quarterOrMonth: false
        }
        companyValuationChart(params).then(response => {
          this.chartData = {
            legend: true,
            datas: [],
            valueFormatter: true,
            legendLeft: 'center',
            xLabel: []
          }
          if (response.data != null) {
            this.chartData.xLabel = response.data.dateList
            this.chartData.datas = [
              {
                name: this.$t('公司整体估值'),
                type: 'line',
                stack: '1',
                data: response.data.companyValuationList
              },
              {
                name: this.$t('项目估值'),
                type: 'line',
                stack: '1',
                data: response.data.projectValuationList
              }
            ]
          }
        })
        // this.$nextTick(() => {
        //   this.$refs.valuationChart.chart.resize()
        // })
      }
      if (e === 1) {
        var params = { dealId: this.$route.query.id, type: this.cashFlowRadio }
        this.getDealCashFLowInfo(params)
      }
      if (e === 2) {
        this.getCashflowList()
      }
    },
    getDealCashFLowInfo(params) {
      getDealCashFLowInfo(params).then(res => {
        var idx = -1
        var item = null
        if (res.data) {
          for (var i = 0; i < res.data.data.length; i++) {
            if (res.data.data[i].type === 'JY') {
              idx = i
              item = res.data.data[i]
              break
            }
          }
          if (idx !== -1) {
            res.data.data.splice(idx, 1)
          }
          if (item !== null) {
            res.data.data.push(item)
          }
          this.quotaList = res.data
        } else {
          this.quotaList = {
            columns: [],
            data: []
          }
        }
      })
    },
    findXIrrDetails(xIrrId) {
      console.log(xIrrId)
      this.xIrrOpen = true
      this.$nextTick(() => {
        this.$refs.xIrrBaseDetailsList.init(xIrrId)
      })
    },
    exportXIrrHandle() {
      this.$nextTick(() => {
        this.$refs.xIrrBaseDetailsList.exportHandle()
      })
    },
    onchange() {
      if (this.proxyRadio === 2) {
        this.getPcwDataKeyList()
      } else {
        this.$nextTick(() => {
          this.initChart()
        })
      }
      if (this.subjectRadio === 2) {
        this.getPcwSubjectList()
      }
      // this.initChart()
    },
    initChart() {
      this.barChartData = {
        legend: true,
        legendLeft: 'center',
        datas: [],
        xLabel: []
      }
      this.pcwDataQuery.dataSource = this.typeGroup
      this.pcwDataQuery.keyCode = this.selectVal
      if (this.proxyRadio === 1) {
        getPcwDataKeysByCharts(this.pcwDataQuery).then(res => {
          if (res.data != null) {
            this.barChartData.xLabel = res.data.x
            this.barChartData.valueFormatter = false
            this.barChartData.datas = res.data.y
            this.barChartData.datas.forEach((item) => {
              item.type = 'bar'
              item.stack = '1'
            })
          }
        })
      }
      if (this.subjectRadio === 1) {
        getPcwFocusCharts(this.pcwDataQuery).then(res => {
          if (res.data != null) {
            this.barChartData.xLabel = res.data.x
            this.barChartData.valueFormatter = true
            this.barChartData.datas = res.data.y
            this.barChartData.datas.forEach((item) => {
              item.type = 'bar'
              item.stack = '1'
            })
          }
        })
      }
    },

    getDealIndicatorData() {
      this.indicatorDetails = this.indicator.dealIndicatorDataDetailList
      if (this.indicatorDetails && this.indicatorDetails.length > 0) {
        var dataArr = this.indicatorDetails.filter(item => item.indicatorId === this.kpiSelectVal && item.dataType === 'YJ')
        var resultArr = []
        var years = []
        dataArr.forEach(item => {
          if (!years.includes(item.year)) {
            years.push(item.year)
          }
        })
        if (this.indicator && (this.indicator.cycle === 'month')) {
          years.forEach((year) => {
            var yearData = dataArr.filter(item => item.year === year)
            yearData.forEach(item => {
              var obj = {}
              obj['quarterYear'] = item.year
              obj['sort'] = Number(item.year + '' + (Number(item.month) < 10 ? '0' + item.month : item.month))
              obj['year'] = item.year + '/' + item.month
              obj['month'] = item.month
              obj['value'] = item.value
              obj[this.kpiSelectLabel + ':EST'] = item.value
              var actData = this.indicatorDetails.find(n => this.kpiSelectVal === n.indicatorId && n.dataType === 'SJ' && n.year === year && item.month === n.month)
              window.dataArr = this.indicatorDetails
              window.yearData = yearData
              if (actData) {
                obj[this.kpiSelectLabel + ':ACT'] = actData.value
                obj[this.kpiSelectLabel + ':%'] = (actData.value / item.value * 100).toFixed(4)
              } else {
                obj[this.kpiSelectLabel + ':ACT'] = 0
                obj[this.kpiSelectLabel + ':%'] = 0
              }
              resultArr.push(obj)
            })
          })

          if (this.kpiQuarter === 1) {
            var q1Data = resultArr.filter(item => item.month >= 1 && item.month <= 3)
            var q2Data = resultArr.filter(item => item.month >= 4 && item.month <= 6)
            var q3Data = resultArr.filter(item => item.month >= 7 && item.month <= 9)
            var q4Data = resultArr.filter(item => item.month >= 9 && item.month <= 12)
            // 计算季节数据
            var q1Obj = this.sumValue(q1Data, 1)
            var q2Obj = this.sumValue(q2Data, 2)
            var q3Obj = this.sumValue(q3Data, 3)
            var q4Obj = this.sumValue(q4Data, 4)
            // 整合数据
            var result = this.finishData(q1Obj, q2Obj, q3Obj, q4Obj, years)
            resultArr = result
          }

          if (this.kpiQuarter === 2) {
            resultArr = this.calcYearSum(resultArr, years)
          }
        } else if (this.indicator && (this.indicator.cycle === 'quarter')) {
          years.forEach(year => {
            var yearData = dataArr.filter(item => item.year === year)
            yearData.forEach(item => {
              var obj = {}
              obj['quarterYear'] = item.year
              obj['sort'] = Number(item.year + '' + item.quarter)
              obj['year'] = item.year + '-Q' + item.quarter
              obj['value'] = item.value
              obj[this.kpiSelectLabel + ':EST'] = item.value
              var actData = this.indicatorDetails.find(n => this.kpiSelectVal === n.indicatorId && n.dataType === 'SJ' && n.year === year && item.quarter === n.quarter)
              window.dataArr = this.indicatorDetails
              window.yearData = yearData
              if (actData) {
                obj[this.kpiSelectLabel + ':ACT'] = actData.value
                obj[this.kpiSelectLabel + ':%'] = (actData.value / item.value * 100).toFixed(4)
              } else {
                obj[this.kpiSelectLabel + ':ACT'] = 0
                obj[this.kpiSelectLabel + ':%'] = 0
              }
              resultArr.push(obj)
            })
          })
          if (this.kpiQuarter === 2) {
            resultArr = this.calcYearSum(resultArr, years)
          }
        } else if (this.indicator && this.indicator.cycle === 'year') {
          years.forEach((year) => {
            var yearData = dataArr.filter(item => item.year === year)
            yearData.forEach(item => {
              var obj = {}
              obj['quarterYear'] = item.year
              obj['sort'] = Number(item.year)
              obj['year'] = item.year
              obj[this.kpiSelectLabel + ':EST'] = item.value
              var actData = this.indicatorDetails.find(n => this.kpiSelectVal === n.indicatorId && n.dataType === 'SJ' && n.year === year)
              if (actData) {
                obj[this.kpiSelectLabel + ':ACT'] = actData.value
                obj[this.kpiSelectLabel + ':%'] = (actData.value / item.value * 100).toFixed(4)
              } else {
                obj[this.kpiSelectLabel + ':ACT'] = 0
                obj[this.kpiSelectLabel + ':%'] = 0
              }
              resultArr.push(obj)
            })
          })
        }

        resultArr.sort((r1, r2) => {
          return r1.sort - r2.sort
        })

        this.resultIndicators = resultArr

        if (this.kpiRadio === 1) {
          this.initIndicatorsChart(resultArr)
        }
      }
    },
    calcMonth(arr) {
      arr.forEach(item => {
        item.month = this.getMonthByQuarter(item.quarter)
      })
      return arr
    },
    initIndicatorsChart(resultArr) {
      console.log(resultArr, '进入图表渲染方法')
      this.$nextTick(() => {
        this.chart1 = echarts.init(document.getElementById('echarts1'))
        var labels = ['year', this.kpiSelectLabel + ':EST', this.kpiSelectLabel + ':ACT', this.kpiSelectLabel + ':%']
        // 获取运营数据
        var options = {
          tooltip: {
            trigger: 'axis',
            axisPointer: {
              lineStyle: {
                color: '#dddc6b'
              }
            }
          },
          legend: {
          },
          dataZoom: [
            {
              show: resultArr.length > 12,
              realtime: true,
              height: 10,
              start: 0,
              end: resultArr.length > 12 ? 50 : 100,
              bottom: -1
            },
            {
              show: resultArr.length > 12,
              type: 'inside',
              realtime: true,
              height: 10,
              start: 0,
              end: resultArr.length > 12 ? 50 : 100
            }
          ],
          color: ['#9077E3', '#78B3FC', '#49CD93'],
          grid: {
            left: '30',
            top: '70',
            right: '30',
            bottom: '20',
            containLabel: true
          },
          dataset: {
            dimensions: labels,
            source: resultArr
          },
          xAxis: [
            {
              type: 'category',
              boundaryGap: ['5%', '5%'],
              axisTick: { show: false },
              axisLine: {
                lineStyle: {
                  color: 'rgba(0,0,0,.1)'
                }
              },
              axisLabel: {
                textStyle: {
                  color: '#333',
                  fontSize: 12
                }
              }
            }
          ],
          yAxis: [
            {
              type: 'value',
              name: '',
              nameTextStyle: {
                color: '#333'
              },
              min: 0,
              // max: 50,
              axisTick: { show: false },
              axisLine: {
                lineStyle: {
                  color: 'rgba(0,0,0,.1)'
                }
              },
              splitLine: {
                show: true,
                lineStyle: {
                  color: 'rgba(0, 0, 0,0.1)'
                }
              },
              axisLabel: {
                textStyle: {
                  color: '#333',
                  fontSize: 12
                }
              }
            },
            {
              name: '',
              type: 'value',
              axisTick: { show: false },
              splitLine: {
                lineStyle: {
                  show: false,
                  color: 'rgba(255,255,255,0)'
                }
              },
              axisLine: {
                show: false
              },
              axisLabel: {
                color: '#fff'
              },
              splitArea: {
                areaStyle: {
                  color: 'rgba(255,255,255,0)'
                }
              }
            }
          ],
          series: [
            {
              type: 'bar',
              barWidth: '20px',
              label: {
                show: true,
                position: 'top'
              },
              itemStyle: {
                color: function() {
                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                    { offset: 0, color: '#9077E3' },
                    { offset: 1, color: '#E8DAFB' }
                  ])
                }
              }
            },
            {
              type: 'bar',
              barWidth: '20px',
              label: {
                show: true,
                position: 'top'
              },
              itemStyle: {
                color: function() {
                  return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                    { offset: 0, color: '#75B6FD' },
                    { offset: 1, color: '#E0EDFB' }
                  ])
                }
              }
            },
            {
              name: this.kpiSelectLabel + ':%',
              type: 'line',
              smooth: true,
              yAxisIndex: 1,
              symbol: 'circle',
              symbolSize: 3,
              areaStyle: {
                opacity: 0.8,
                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                  {
                    offset: 0,
                    color: '#85D19A'
                  },
                  {
                    offset: 1,
                    color: '#fff'
                  }
                ])
              },
              showSymbol: false
            }
          ],
          animationEasing: 'cubicInOut',
          animationDuration: 3000
        }
        this.chart1.setOption(options, true)
      })
    },

    calcYearSum(dataArr, years) {
      var result = []
      years.forEach(year => {
        var obj = {}
        var yearData = dataArr.filter(item => year === item.quarterYear)
        var yjSum = new Decimal(0)
        var sjSum = new Decimal(0)
        // var ratioSum = new Decimal(0)
        yearData.forEach(item => {
          yjSum = yjSum.add(new Decimal(item[this.kpiSelectLabel + ':EST']))
          sjSum = sjSum.add(new Decimal(item[this.kpiSelectLabel + ':ACT']))
        })
        obj['year'] = year
        obj['sort'] = parseInt(year)
        obj[this.kpiSelectLabel + ':EST'] = yjSum.toNumber()
        obj[this.kpiSelectLabel + ':ACT'] = sjSum.toNumber()
        obj[this.kpiSelectLabel + ':%'] = (sjSum.div(yjSum).mul(new Decimal(100))).toNumber()
        result.push(obj)
      })
      return result
    },

    /**
     * 整合季度数据
     * @param q1 第一季度
     * @param q2 第二季度
     * @param q3 第三季度
     * @param q4 第四季度
     */
    finishData(q1, q2, q3, q4, years) {
      var result = []
      years.forEach(year => {
        var q1Data = q1[year + '-Q1']
        var q2Data = q2[year + '-Q2']
        var q3Data = q3[year + '-Q3']
        var q4Data = q4[year + '-Q4']
        // 第一季度
        var q1Obj = this.getQuarterData(year, 1, q1Data)
        result.push(q1Obj)
        // 第二季度
        var q2Obj = this.getQuarterData(year, 2, q2Data)
        result.push(q2Obj)
        // 第三季度
        var q3Obj = this.getQuarterData(year, 3, q3Data)
        result.push(q3Obj)
        // 第四季度
        var q4Obj = this.getQuarterData(year, 4, q4Data)
        result.push(q4Obj)
      })
      return result
    },

    getQuarterData(year, quarter, orginData) {
      var obj = {}
      obj['year'] = year + '-Q' + quarter
      obj['sort'] = Number(year + '' + quarter)
      obj[this.kpiSelectLabel + ':EST'] = orginData['est']
      obj[this.kpiSelectLabel + ':ACT'] = orginData['act']
      obj[this.kpiSelectLabel + ':%'] = orginData['ratio']
      return obj
    },

    sumValue(arr, quarter) {
      var years = []
      arr.forEach(item => {
        if (!years.includes(item.quarterYear)) {
          years.push(item.quarterYear)
        }
      })

      var obj = {}
      years.forEach(year => {
        var yjSum = new Decimal(0)
        var sjSum = new Decimal(0)
        var ratioSum = new Decimal(0)
        var handler = arr.filter(item => item.quarterYear === year)
        handler.forEach(item => {
          yjSum = yjSum.add(new Decimal(item[this.kpiSelectLabel + ':EST']))
          sjSum = sjSum.add(new Decimal(item[this.kpiSelectLabel + ':ACT']))
          ratioSum = ratioSum.add(new Decimal(item[this.kpiSelectLabel + ':%']))
        })
        obj[year + '-Q' + quarter] = {
          est: yjSum.toNumber(),
          act: sjSum.toNumber(),
          ratio: ratioSum.toNumber(),
          year: year,
          quarter: quarter
        }
      })
      return obj
    },

    sumKeyQuarter(arr) {
      var sum = new Decimal(0)
      arr.forEach(item => {
        sum.add(new Decimal(item.value))
      })
      return sum.toNumber()
    },
    getQuarterSum(quarterSum, year, quarter, indicator) {
      var obj = {}
      obj['value'] = quarterSum
      obj['year'] = year
      obj['quarter'] = 'Q' + quarter
      obj['keyCode'] = indicator.indicatorsCode
      obj['indicators'] = indicator.indicators
      return obj
    },

    loadChart() {
      this.chart2 = echarts.init(document.getElementById('echarts2'))
      var data = this.operatOptions.find(item => this.kpiSelectVal === item.id)
      // 获取实际数据
      var actIndicators = []
      if (this.indicatorDetails && this.indicatorDetails.length > 0) {
        actIndicators = this.indicatorDetails.filter(item => item.dataType === 'SJ')
      }

      var years = []
      actIndicators.forEach(item => {
        if (!years.includes(item.year)) {
          years.push(item.year)
        }
      })

      this.actIndicators.forEach(item => {
        actIndicators.forEach(act => {
          if (item.id === act.indicatorId) {
            act['keyCode'] = item.indicatorsCode
          }
        })
      })

      var formula = data.indicatorsCodeFormula
      var formatFormula = data.indicatorsCodeFormula

      var resultArr = []
      if (this.indicator && this.indicator.cycle === 'month') {
        resultArr = []
        years.forEach(year => {
          var filterArr = actIndicators.filter(item => year === item.year)
          for (var i = 0; i < 12; i++) {
            var monthData = filterArr.filter(f => f.month === (i + 1) + '')
            monthData.forEach(month => {
              formatFormula = formatFormula.replaceAll('{' + month.keyCode + '}', month.value)
            })
            var obj = {}
            var m = i + 1
            formatFormula = formatFormula.replaceAll('{', '')
            formatFormula = formatFormula.replaceAll('}', '')

            // eslint-disable-next-line no-eval
            obj.value = eval(formatFormula)
            obj.month = m
            obj.year = year + '-' + m
            obj.sort = parseInt(year + '' + (i + 1))
            resultArr.push(obj)
            formatFormula = formula
          }
        })
        if (this.kpiQuarter === 1) {
          resultArr = []
          var quarterData = []
          years.forEach(year => {
            this.actIndicators.forEach(indicator => {
              var filterArr = actIndicators.filter(item => year === item.year && indicator.id === item.indicatorId)

              var q1 = filterArr.filter(item => item.month >= 1 && item.month <= 3)
              var q2 = filterArr.filter(item => item.month >= 4 && item.month <= 6)
              var q3 = filterArr.filter(item => item.month >= 7 && item.month <= 9)
              var q4 = filterArr.filter(item => item.month >= 10 && item.month <= 12)

              var q1Sum = this.sumKeyQuarter(q1)
              var q2Sum = this.sumKeyQuarter(q2)
              var q3Sum = this.sumKeyQuarter(q3)
              var q4Sum = this.sumKeyQuarter(q4)

              quarterData.push(this.getQuarterSum(q1Sum, year, 1, indicator))
              quarterData.push(this.getQuarterSum(q2Sum, year, 2, indicator))
              quarterData.push(this.getQuarterSum(q3Sum, year, 3, indicator))
              quarterData.push(this.getQuarterSum(q4Sum, year, 4, indicator))
            })
          })
          years.forEach(year => {
            var filterArr = quarterData.filter(item => year === item.year)
            for (var i = 0; i < 4; i++) {
              var monthData = filterArr.filter(f => f.quarter === 'Q' + (i + 1) + '')
              monthData.forEach(month => {
                formatFormula = formatFormula.replaceAll('{' + month.keyCode + '}', month.value)
              })
              var obj = {}
              var m = i + 1
              formatFormula = formatFormula.replaceAll('{', '')
              formatFormula = formatFormula.replaceAll('}', '')

              // eslint-disable-next-line no-eval
              obj.value = eval(formatFormula)
              obj.year = year + '-' + 'Q' + m
              obj.sort = parseInt(year + '' + (i + 1))
              resultArr.push(obj)
              formatFormula = formula
            }
          })
        }
        if (this.kpiQuarter === 2) {
          var yearData = []
          resultArr = []
          years.forEach(year => {
            this.actIndicators.forEach(indicator => {
              var filterArr = actIndicators.filter(item => year === item.year && indicator.id === item.indicatorId)
              var sum = new Decimal(0)
              filterArr.forEach(value => {
                sum = sum.add(new Decimal(value.value))
              })
              var obj = {}
              obj['value'] = sum.toNumber()
              obj['year'] = year
              obj['keyCode'] = indicator.indicatorsCode
              obj['indicators'] = indicator.indicators
              yearData.push(obj)
            })
          })
          // 计算年份数据
          years.forEach(year => {
            var filterArr = yearData.filter(item => year === item.year + '')
            filterArr.forEach(yearData => {
              formatFormula = formatFormula.replaceAll('{' + yearData.keyCode + '}', yearData.value)
            })
            var obj = {}
            formatFormula = formatFormula.replaceAll('{', '')
            formatFormula = formatFormula.replaceAll('}', '')

            // eslint-disable-next-line no-eval
            obj.value = eval(formatFormula)
            obj.year = year
            obj.sort = parseInt(year)
            resultArr.push(obj)
          })
        }
      } else if (this.indicator.cycle === 'quarter') {
        resultArr = []
        years.forEach(year => {
          var filterArr = actIndicators.filter(item => year === item.year)
          for (var i = 0; i < 4; i++) {
            var monthData = filterArr.filter(f => f.quarter === (i + 1) + '')
            monthData.forEach(month => {
              formatFormula = formatFormula.replaceAll('{' + month.keyCode + '}', month.value)
            })
            var obj = {}
            var m = i + 1
            console.log(formatFormula, '公式')
            formatFormula = formatFormula.replaceAll('{', '')
            formatFormula = formatFormula.replaceAll('}', '')

            // eslint-disable-next-line no-eval
            obj.value = eval(formatFormula)
            obj.month = m
            obj.year = year + 'Q' + m
            obj.sort = parseInt(year + '' + (i + 1))
            resultArr.push(obj)
            formatFormula = formula
          }
        })
        if (this.kpiQuarter === 2) {
          // eslint-disable-next-line no-redeclare
          resultArr = []
          // eslint-disable-next-line no-redeclare
          var yearData = []
          years.forEach(year => {
            this.actIndicators.forEach(indicator => {
              var filterArr = actIndicators.filter(item => year === item.year && indicator.id === item.indicatorId)
              var sum = new Decimal(0)
              filterArr.forEach(value => {
                sum = sum.add(new Decimal(value.value))
              })
              var obj = {}
              obj['value'] = sum.toNumber()
              obj['year'] = year
              obj['keyCode'] = indicator.indicatorsCode
              obj['indicators'] = indicator.indicators
              yearData.push(obj)
            })
          })
          // 计算年份数据
          years.forEach(year => {
            var filterArr = yearData.filter(item => year === item.year + '')
            filterArr.forEach(yearData => {
              formatFormula = formatFormula.replaceAll('{' + yearData.keyCode + '}', yearData.value)
            })
            var obj = {}
            formatFormula = formatFormula.replaceAll('{', '')
            formatFormula = formatFormula.replaceAll('}', '')

            // eslint-disable-next-line no-eval
            obj.value = eval(formatFormula)
            obj.year = year
            obj.sort = parseInt(year)
            resultArr.push(obj)
            formatFormula = formula
          })
        }
      } else if (this.indicator.cycle === 'year') {
        resultArr = []
        years.forEach(year => {
          var filterArr = actIndicators.filter(item => year === item.year)
          console.log(filterArr, '年度数据')
          filterArr.forEach(yearData => {
            formatFormula = formatFormula.replaceAll('{' + yearData.keyCode + '}', yearData.value)
            console.log(formatFormula, year, '年度计算公式数值')
          })
          var obj = {}
          formatFormula = formatFormula.replaceAll('{', '')
          formatFormula = formatFormula.replaceAll('}', '')
          // eslint-disable-next-line no-eval
          obj.value = eval(formatFormula)
          obj.year = year
          obj.sort = parseInt(year)
          resultArr.push(obj)
          formatFormula = formula
        })
      }

      resultArr.sort((r1, r2) => {
        return r1.sort - r2.sort
      })

      var x = []
      var dataArr = []
      resultArr.forEach(item => {
        x.push(item.year)
        dataArr.push(item.value)
      })

      this.chart2.setOption({
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            lineStyle: {
              color: '#dddc6b'
            }
          }
        },
        grid: {
          left: '30',
          top: '70',
          right: '30',
          bottom: '20',
          containLabel: true
        },
        xAxis: {
          type: 'category',
          axisTick: { show: false },
          axisLine: {
            lineStyle: {
              color: 'rgba(0,0,0,.1)'
            }
          },
          splitLine: {
            show: false,
            lineStyle: {
              color: 'rgba(0, 0, 0,0.1)'
            }
          },
          axisLabel: {
            show: false,
            textStyle: {
              color: '#333',
              fontSize: 12
            }
          },
          data: x
        },
        yAxis: {
          type: 'value',
          axisTick: { show: false },
          splitLine: {
            lineStyle: {
              show: false,
              color: 'rgba(255,255,255,0)'
            }
          },
          axisLine: {
            show: false
          },
          axisLabel: {
            color: '#333'
          },
          splitArea: {
            areaStyle: {
              color: 'rgba(255,255,255,0)'
            }
          }
        },
        color: ['#FE94A9'],
        series: [
          {
            data: dataArr,
            type: 'line'
          }
        ],
        animationEasing: 'cubicInOut',
        animationDuration: 3000
      }, true)
    }
  }
}
</script>
<style lang="scss" scoped>
/deep/.tagInvest{
  .el-checkbox.is-bordered.is-checked{
    border-color: #56bf90!important;
  }
  .el-checkbox__label {
    padding-left: 5px;
  }
  .is-checked .el-checkbox__label{
    color: #56bf90!important;
  }
  .el-checkbox.is-bordered.el-checkbox--mini{
    padding: 2px 10px 4px 10px;
    margin-right: 10px;
    height: auto;
    margin-left: 0px;
  }
  .el-checkbox__inner{
    transition: unset;
  }
  .el-checkbox__inner:hover {
    border-color: #56bf90;
}
  .el-checkbox__input.is-checked .el-checkbox__inner {
    background-color: #56bf90;
    border-color: #56bf90;
  }
  .el-checkbox__input.is-focus .el-checkbox__inner {
    border-color: #DCDFE6;
  }

}
.investDetail{
  /deep/.m0{
    margin: unset !important;
  }
  padding: 0 13px;
  position: relative;
  font-size: 14px;
  margin: 0 !important;
  border-radius: 5px;
  .el-col {
    margin-bottom: 8px;
    line-height: 24px;
    display: flex;
    .label {
      color: #8a8a8a;
    }
    .link-hover-click {
      color: #333;
      font-weight: bold;
      flex: 1;
      overflow: hidden;
      text-overflow: ellipsis;
    }
  }
}
.noImg{
  &::before, &::after{
    content: unset!important;
  }
}
.mb15{
  margin-bottom: 15px;
}
.chartDom{
  position: relative;
  /deep/.el-select{
    width: 170px;
    position: absolute;
    left: 15px;
    z-index: 9;
    .el-input__inner{
      border-radius: 12px;
    }
  }
}
/deep/.quotaList{
  tr td{
    &:first-child{
      background-color: #f6f7fb !important;
    }
  }
}
.finance{
  display: flex;
  align-items: center;
  justify-content: space-between;
  /deep/.el-radio{
    margin-right: 10px;
  }
  .rightBorder{
    border-right: 1px solid #ddd;
    margin-right: 15px;
    padding-right: 10px;
  }
}
.organ-tag, .fund-tag{
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 9px;
}
.organ-tag{
  color: #F48828;
  border: 1px solid #F48828;
}
.fund-tag{
  color: #41A0FE;
  border: 1px solid #41A0FE;
}
.general-view{
  height: calc(100vh - 90px);
  .card-flex{
    display: flex;
    column-gap: 15px;
    .list-table{
      flex: 1;
      z-index: 1;
      position: relative;
      overflow: hidden;
      &::before, &::after{
        position: absolute;
        content: '';
        width: 130px;
        height: 130px;
        border-radius: 50%;
        background-image: linear-gradient(#fff, #F0F9FF, #F0F9FF);
        top: -70px;
        left: -20px;
        z-index: -1;
      }
      &::before{
        opacity: 0.4;
      }
      &::after{
        opacity: 0.8;
        top: 70px;
        left: 110px;
      }
    }
  }
  .el-row, .el-col{
    // height: 100%;
    .list-table{
      // height: 100%;
      box-shadow: 0 0px 13px 0px #c2d0ea;
      .head{
        display: flex;
        align-items: center;
        justify-content: space-between;
        .icon{
          width: 40px;
          height: 40px;
          background-size: contain;
          display: block;
        }
        .el-icon-more{
          transform: rotate(90deg);
          cursor: pointer;
        }
      }
      .title{
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin: 5px 0 10px;
        padding: 0 5px;
        h3{
          margin: 0;
          font-size: 15px;
        }
        span{
          color: #b3b3b3;
          font-size: 12px;
        }
      }
      .ul-list{
        padding: 0 5px;
        li{
          margin-bottom: 10px;
          p{
            margin: 0;
            font-size: 12px;
            position: relative;
            color: rgba(0,0,0,0.8);
            font-weight: bold;
            margin-bottom: 3px;
          }
          &:last-child{
            margin-bottom: 0px;
          }
        }
      }
      .xmfx-li{
        padding: 0 5px;
        margin-top: 15px;
        p{
          margin: 0;
          font-size: 12px;
          position: relative;
          color: rgba(0,0,0,0.8);
          font-weight: bold;
          margin-bottom: 8px;
          span{
            margin: 0 3px 0px 15px;
          }
          &:last-child{
            margin-bottom: 0px;
          }
        }
      }
    }
    .gzxx-icon{
      background: url('~@/assets/image/dealAfter/gzxx.png');
    }
    .xmhk-icon{
      background: url('~@/assets/image/dealAfter/xmhk.png');
    }
    .xmfx-icon{
      background: url('~@/assets/image/dealAfter/xmfx.png');
    }
    .cbjk-icon{
      background: url('~@/assets/image/dealAfter/cbjk.png');
    }
    .zdsx-icon{
      background: url('~@/assets/image/dealAfter/zdsx.png');
    }
    .wpry-icon{
      background: url('~@/assets/image/dealAfter/wpry.png');
    }
    .thgz-icon{
      background: url('~@/assets/image/dealAfter/thgz.png');
    }
    .gzxx{
      .dyestuff{
        color: #4696F2!important;
      }
    }
    .xmhk{
      &::before, &::after{
        background-image: linear-gradient(#FBFFFF, #F0FAFC, #F0FAFC);
      }
      .dyestuff{
        color: #3C99D4!important;
      }
    }
    .xmfx{
      &::before, &::after{
        background-image: linear-gradient(#FFFCF9, #FEF0EF, #FEF0EF);
      }
      .dyestuff{
        color: #D24645;
      }
    }
    .cbjk{
      &::before, &::after{
        background-image: linear-gradient(#FFFCF9, #FFF6EF, #FFF6EF);
      }
      .dyestuff{
        color: #D24645;
      }
      .xmfx-li{
        margin-top: 25px;
        p{
          padding-left: 15px;
          position: relative;
          &::before{
            position: absolute;
            content: '';
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: #D24645;
            left: 0;
            top: calc(50% - 4px);
          }
          &:last-child{
            &::before{
              background: #FB811D;
            }
            .dyestuff{
              color: #FB811D!important;
            }
          }
        }
      }
    }
    .zdsx{
      &::before, &::after{
        background-image: linear-gradient(#FFFCF9, #F5F8FD, #F5F8FD);
      }
      .dyestuff{
        color: #75A2F4!important;
        margin: 0!important;
      }
      .xmfx-li{
        margin-top: 25px;
      }
    }
    .wpry{
      &::before, &::after{
        background-image: linear-gradient(#FFFCF9, #F1FBFC, #F1FBFC);
      }
      .dyestuff{
        color: #67CDB6!important;
        margin: 0!important;
      }
      .xmfx-li{
        margin-top: 25px;
      }
    }
    .thgz{
      &::before, &::after{
        background-image: linear-gradient(#FFFCF9, #EDF8FE, #EDF8FE);
      }
      .dyestuff{
        color: #28B0F6!important;
        margin: 0!important;
      }
      .xmfx-li{
        margin-top: 25px;
      }
    }

  }
  .view-top{
    height: 260px!important;
  }
  .view-bottom{
    height: calc(100% - 275px)!important;;
    .left .list-table{
      height: calc(50% - 10px);
    }
  }
}
.currentDeal{
  .area-header{
    margin-bottom: 15px;
    .tag{
      color: #fff;
      font-size: 11px;
      padding: 6px 10px;
      border-radius: 15px;
      margin-left: 5px;
    }
  }
  /deep/.el-table__header th {
    background-color: #41A0FE!important;
    color: #fff !important;
  }
  /deep/ .el-table__fixed {
    height: 100% !important;
  }
}
/deep/.el-descriptions{
  .noLabel{
    margin-right: 0;
    &::after{
      content: unset!important;
    }
  }
  .tagLabel{
    margin-bottom: 5px;
    .el-tag{
      border-radius: 10px;
      border-color: transparent!important;
      margin-right: 5px;
    }
  }
  .el-descriptions__header{
    margin-bottom: 10px;
  }
}
.infinite-list-wrapper{
  height: calc(100% - 25px);
  overflow: auto;
  margin-right: -15px;
  padding-right: 15px;
  .loadTxt{
    text-align: center;
    font-size: 11px;
    color: #a7a7a7;
  }
  li{
    margin-bottom: 8px;
    border-bottom: 1px solid #f4f4f4;
    padding-bottom: 8px;
    display: flex;
    .type{
      background: #ddd;
      height: 17px;
      font-size: 10px;
      padding: 3px 4px;
      color: #fff;
      margin-right: 4px;
      border-radius: 3px;
      zoom: 0.9;
    }
    .type0{
      background: #0DA708;
    }
    .type1{
      background: #DD2710;
    }
    .tit{
      font-weight: bold;
      font-size: 12px;
      margin-bottom: 7px;
      padding-top: 1px;
      color: #409eff;
      cursor: pointer;
    }
    .des{
      display: flex;
      align-items: center;
      span{
        font-size: 11px;
        color: rgba(0,0,0,0.55);
        margin-right: 5px;
      }
      i{
        background-color: #fdf6ec;
        border: 1px solid #e6a23c;
        color: #e6a23c;
        font-size: 10px;
        font-style: normal;
        padding: 2px;
        zoom: 0.8;
        margin-right: 5px;
      }
    }
  }
}
.scrollArea{
  height: calc(100% - 25px);
  overflow: auto;
  margin-right: -15px;
  padding-right: 15px;
}

.h170{
  height: 170px!important;
}
.hauto{
  height: calc(100% / 3 - 68px)!important;
}

.statistic-flex{
  display: flex;
  align-items: center;
  .head{
    width: 100%;
    margin: 0;
    padding: 0;
    color: #000;
    font-size: 14px;
    font-variant: tabular-nums;
    line-height: 1.5715;
    list-style: none;
    font-feature-settings: "tnum";
    text-align: center;
    display: flex;
    align-items: center;
    .title {
      color: rgba(0,0,0,.85);
      font-size: 14px;
      font-weight: 600;
      display: block;
      margin: 0;
      line-height: 100%;
      text-align: left;
    }
    .prefix{
      width: 25px;
      height: 25px;
      border-radius: 50%;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-right: 5px;
      background: #F4F0FF;
      color: #8B54FF;
    }
    .ratio{
      background: #FFF3EB;
      color: #FF8722;
    }
  }

  .sum{
    .prefix{
      background: #F4F0FF;
      color: #8B54FF;
    }
  }
  .ratio{
    .prefix{
      background: #FFF3EB;
      color: #FF8722;
    }
  }
}
.list-table{
  padding-top: 10px;
}
.pad10{
  padding: 10px;
}

/deep/.el-divider--horizontal{
  margin: 20px 0;
  .el-divider__text{
    font-size: 11px;
    padding: 0 10px;
    font-weight: unset;
    color: rgba(0,0,0,0.35);
    white-space: nowrap;
  }
}
.appraise{
  margin-bottom: 10px;
  h4{
    font-size: 13px;
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .info{
    padding: 8px 10px;
    background-color: #ecf8ff;
    border-radius: 4px;
    color: #8492a6;
  }
}
.flex-between{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
/deep/.overviewTable{
  border: none;
  .first {
    border-left: 1px solid #dfe6ec;
  }
  .last {
    border-right: 1px solid #dfe6ec;
  }
  .empty {
    background-color: #fff !important;
    border: none !important;
    border-right: 1px solid #dfe6ec !important;
  }
}
.pointer{
  position: absolute;
  right: 10px;
  z-index: 9;
  .svg-icon{
    font-size: 12px;
    cursor: pointer;
  }
}
.screenStyle{
  background: #fff;
  padding: 15px;
  margin: 0;
  bottom: 0;
  overflow: auto;
  .noImg{
    // overflow: auto;
  }
  .link-hover-click{
    max-height: unset!important;
    overflow: unset!important;
  }
}

/deep/.customDialog .el-dialog__body {
  height: 48vh;
  overflow-y: auto;
  .list-table {
    margin: -20px;
  }
}
.list-table{
  position: relative;
  .arrow{
    position: absolute;
    right: 0;
    top: calc(50% - 22px);
    font-size: 13px;
    background: #e7e7e7;
    padding: 15px 0px;
    cursor: pointer;
    border-radius: 6px 0 0 6px;
    font-weight: bold;
  }
}

.rightSelect {
  position: absolute;
  right: 0px;
  width: 150px;
  top: -2px;
  z-index: 99;
}
</style>
